Breaking Quarto Dashboard into separate linked pages to reduce loading time

[DavidRach]

Description

Hi All, I am tinkering with my first quarto dashboard, it's purpose is to visualize quality control information of individual laser parameters for spectral flow cytometers used in immunology research.

The current dashboard has four pages, the last three have a lot of interactive plotly elements that are large in size (>60 MB) and slow the initial loading of the page. The initial home page by contrast shows just summary data and is not interactive. However, in the current version of my dashboard it's a single .qmd file, rendered together, and consequently when the url is accessed it takes a minute or two to load everything in .

I was wondering if anyone knows a way to render the dashboard/split up the dashboard while still linking the components. In my mind I would want to navigate to the site, have the lightweight summary page load in first, and then if the user clicks on a page tab for a specific instrument it will then take them to that page, with the longer loading time occurring at that point.

Open to other approaches that might work as well!

The repo with dashboard code is here and the slow-loading dashboard version is viewable here (takes a couple minutes to load in, intended for laboratory computer screens not mobile phones)

Thanks for any suggestions/insights, I greatly appreciate it! Best- David

[mcanouil]

Maybe what you want/need is not a dashboard but a website with interactive components.

[DavidRach]

Thanks for the suggestion @mcanouil. I ended up breaking the individual dashboard up, with each dashboard page being moved into it's own .qmd file. I then modified the quarto.yml file as a website to link the resulting dashboard pages. Couple theming differences left to resolve for a sidebar, but the loading speed issue has been significantly reduced.