Loading chunk 196 failed error - Windows 11 + Firefox/Edge browsers

Hi Dash Team,

having an issue with my Dash app and hope you can help.

Context

I have a Dash app that works fine in Windows 10 + various browsers (I run on my work computer in development server).

App automates analysis of uploaded files and displays mixture of plots as png images, interactive plots and Pandas styled tables.

Note: some data runs into millions of points and for front-end performance I convert standard interactive plots to pngs and display these instead.

I tried to run on my home computer on Windows 11 but had 2 main issues as decribed below.

Dependencies

pandas==1.3.1
numpy==1.20.1
scikit-learn==0.22.1
scipy==1.4.1
plotly==5.0.0
dash==2.6.1
dash-core-components==2.0.0
dash-html-components==2.0.0
dash-extensions==0.0.58
dash-uploader==0.5.0
flask==2.1.0
kaleido==0.2.1

System details

  • OS: Windows 11
  • Browser [Firefox]
  • Version [111.0.1 (64-bit)]

Bug description

Loading chunk 196 failed error - seems specific to display of interactive plots.

I write all plots and tables to disk. Interestingly, interactive plots are written to local folder and launch ok in browser, but are not rendered in designated tabs.

Additionally, processes that precede displaying plot pngs (converted from interactive plots) hang indefinitely - as far as I can tell Python pre-processing completes and then hangs in the conversion of plots to pngs. Only Pandas styled tables, that are directly pngs and passed to dashboard front end, display properly (interactive plots in same tab don’t appear).

Stack trace as below:

"Loading chunk 196 failed.
(timeout: http://127.0.0.1:8050/_dash-component-suites/dash/dcc/async-graph.js)
(This error originated from the built-in JavaScript code that runs Dash apps. Click to see the full stack trace or open your browser’s console.)

i.f.j@http://127.0.0.1:8050/_dash-component-suites/dash/dcc/dash_core_components.v2_6_1m1681131438.js:2:537575

i.e/<@http://127.0.0.1:8050/_dash-component-suites/dash/dcc/dash_core_components.v2_6_1m1681131438.js:2:534880

i.e@http://127.0.0.1:8050/_dash-component-suites/dash/dcc/dash_core_components.v2_6_1m1681131438.js:2:534845

49069/v<@http://127.0.0.1:8050/_dash-component-suites/dash/dcc/dash_core_components.v2_6_1m1681131438.js:2:43821

17800/e.exports</i/o.get<@http://127.0.0.1:8050/_dash-component-suites/dash/dcc/dash_core_components.v2_6_1m1681131438.js:2:1697

initializeLazyComponentType@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:1450:22

readLazyComponentType@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:11997:32

mountLazyComponent@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:17467:42

beginWork@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:18737:18

beginWork$1@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:23314:16

performUnitOfWork@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:22292:14

workLoopSync@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:22265:24

performSyncWorkOnRoot@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:21891:11

flushSyncCallbackQueueImpl/<@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:11224:26

unstable_runWithPriority@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react@16.v2_6_1m1681131438.14.0.js:2685:14

runWithPriority$1@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:11174:12

flushSyncCallbackQueueImpl@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:11219:26

flushSyncCallbackQueue@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:11207:5

discreteUpdates$1@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:22028:9

discreteUpdates@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:803:14

dispatchDiscreteEvent@http://127.0.0.1:8050/_dash-component-suites/dash/deps/react-dom@16.v2_6_1m1681131438.14.0.js:4291:20"

Expected behavior

App runs Python processes in back-end i.e. data processing, plot generation, conversion of some plots to pngs and then displays all plots and tables in a multi-tab dashboard. Additionally all plots and tables written to local folder.

Thanks for your time and happy to answer any questions.