Document overridable Plotly.js and Highlight.js packages for component libraries

[Marc-Andre-Rivet]

Follow async support, it's now possible for app developers to override the version of Plotly.js used by Dash. It will soon be possible to do the same thing for syntax highlighting.

This needs to be documented somewhere, in some "advance" usage section.

[nicolaskruchten]

Also it would be nice to stress that this is "the way" to load a partial plotly.js bundle if you e.g. don't want the big mapping files :)

[chriddyp]

Some more context for whoever folds this into the docs:

The async-plotlyjs.js file is 3.25MB which makes it one of the larger resources loaded in a Dash app. If you aren't using all of the chart types, then you can use a smaller plotly.js bundle. Here is a list of the available bundles: https://github.com/plotly/plotly.js/blob/master/dist/README.md#partial-bundles. For example, if you are just using cartesian plots, you can use the cartesian bundle which is 1.02MB instead. To use this, you have two options:

1. Download the bundle from a link on that page and place the JS file in assets/. It can be named anything. When this file is loaded, dcc.Graph will detect that Plotly is already defined instead of loading the 3.5MB async-plotly.js bundle.
2. If you don't want to download the file, you could link to the external CDN instead. This is also listed in the reference in https://github.com/plotly/plotly.js/blob/master/dist/README.md#bundle-information. As per https://dash.plotly.com/external-resources, to link external JS you would do something like:

app = dash.Dash(__name__, external_scripts=['https://cdn.plot.ly/plotly-basic-1.54.3.min.js'])

Note that by loading files this way, plotly.js will be loaded immediately when you open your Dash app instead of asynchronously when your Dash app needs to render a Graph. So, if your Dash app's home page doesn't have any graphs in it, you could be loading plotly.js before it's absolutely necessary.

[coleweusthem]

Is there a way to generate your own copy of async-plotlyjs.js? I need to make some changes to a graph to make it compliant with standards I need to follow

[nathan-chan-brt]

Can you load multiple partial bundles? Or only one?

[alexcjohnson]

Only one. The links above describe how to make your own bundle with just the trace types you need, if there isn’t a partial bundle that meets your requirements