search

voila-dashboards / voila

Voilà turns Jupyter notebooks into standalone web applications
https://voila.readthedocs.io
Other
5.45k stars 504 forks source link

Main bundle is very large and draws in a lot of unneeded css #149

Open maartenbreddels opened 5 years ago

maartenbreddels commented 5 years ago

As mentioned in #145 it would be nice to split the controls bundle off, and in #134 it was mentioned that the webpack bundle takes a long time to assemble.

Via the @jupyter-widgets/jupyterlab-manager we pull in @jupyter-widgets/controls, and via jupyterlab we pull in even blueprintjs. I don't think we want the manager to pull in all this, including the css of for instance blueprintjs (which will eventually bite us by giving css collisions).

To give an example, if I remove rules from webpack, I can see how blueprint comes in:

    ERROR in /Users/maartenbreddels/src/ipywidgets/node_modules/@blueprintjs/core/lib/css/blueprint.css 1:0
    Module parse failed: Unexpected character '@' (1:0)
    You may need an appropriate loader to handle this file type.
    > @charset "UTF-8";
    | /*!
    |
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/ui-components/lib/index.js 20:0-50
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/apputils/lib/toolbar.js
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/apputils/lib/index.js
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/rendermime/lib/registry.js
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/rendermime/lib/index.js
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/outputarea/lib/model.js
     @ /Users/maartenbreddels/src/ipywidgets/node_modules/@jupyterlab/outputarea/lib/index.js
     @ /Users/maartenbreddels/src/ipywidgets/packages/jupyterlab-manager/lib/output.js
     @ /Users/maartenbreddels/src/ipywidgets/packages/jupyterlab-manager/lib/index.js
     @ ./lib/manager.js
     @ ./lib/index.js
     @ multi ./lib/index.js

Should we revert the JupyterLab manager to the HTMLManager again to avoid this?

vidartf commented 5 years ago

FYI: A nice tool to see your dependency graph is to use webpack --profile --json > stats.json and then analyse it e.g. with https://webpack.github.io/analyse/#modules

maartenbreddels commented 5 years ago

Thanks vidar, i've done that, and it would be a good topic for the dashboarding workshop to look into together with some of the Jupyter lab people!

vidartf commented 5 years ago

I'm doing quite a bit of work on this on the jupyterlab repo now before the 1.0, so hopefully some of this will be magically fixed ;)