Dash loads chunks unnecessarily

I would have expected that Dash only loads the js chunks that it actually needs. However, it seems that it loads all chunks for a library, even the ones you don’t use. Consider this small example app,

from dash import Dash, html

app = Dash()
app.layout = html.Div(["Hello world!"])

if __name__ == '__main__':
    app.run_server()

It uses only the html module, but the js chunk for e.g. for the dcc module is loaded anyhow,

which seems very ineffective. Is this by design? Or is it a bug? @chriddyp @alexcjohnson

I guess you could be using dcc in clientside_callback in which case you’d want it loaded? But agreed that purging the unused chunks would be nice speed up upfront load time :slight_smile:

That’s true. If chunks are resolved at app initialization, dynamic imports might also become an issue. My personal motivation for diving into this is that the Mermaid component in dash-extensions loads almost 1 MB of assets. And since most people are using other features from dash-extensions, I would really like to avoid loading this chunk on every dash-extensions import.

Hey Emil - just curious if you see the same thing in dash < v2. Maybe this has something to do with the monorepo?

It turns out it was a bug in my __init__.py file that caused all chunks to load. Following the structure of the latest cookie cutter template, the chunks are loaded dynamically as intended :slight_smile:

Glad you made progress on this @Emil ! One extra bit to add to it: Currently we do load the entry point bundles for all packages up front - any package that’s imported in Python. This needs to include at the very least all the prop type definitions for all components in the package. Then the async chunk framework that components can opt into allows other pieces to be loaded later.

Having said that, it seems like the dcc entry point chunk is awfully large at 700kB - that can’t all be prop types! We may want to dig in there and see if that can be reduced.

2 Likes