Clientside cache on graphs across multipage

Hey there, I’ve noticed that in a multipage app each time a page is changed, the graphs have to be reloaded from the server, which causes a lot of traffic.

I have a multipage app for a lot of graphs but the data is static, is there any way we can cache the graphs on the client side, so that when switching between the pages the graphs will not reload from the server, but only reload upon the user manual request?

Thank you.

Hi @pengz, welcome to the community.

You could store the graphs in a dcc.Store() which is client side. Bit there is a limit for stored data which depends on the browser.

Thank you @AIMPED for replying, yes the size limit of is also the concern here. So far I haven’t figured out a good way to optimize this. :smiling_face_with_tear:

You could try out dynamic components,

I haven’t gotten around to write full docs, but the example above should give you an idea of how it works. If you don’t need to share components across pages, just include a single dynamic component on each page that holds the complete layout of the page.

Hello @pengz,

You can check out my caching for page layouts.

Since your data is static, you shouldn’t have to worry those pitfalls that you can normally encounter.

You will use the clientside caching in the browser if HTTPS and just a local variable if you aren’t local.

My multipage Dash app reload from the server upon each page change, leading to a significant increase in server traffic. Since the data for these graphs remains static, I’m exploring ways to optimize the app’s performance. I’m particularly interested in implementing client-side caching to store the graph data locally on my browser. This would ideally prevent the graphs from reloading when I switch between pages, enhancing the app’s efficiency.