On several occasions in the past I’ve observed that if I have a long running angular.io app open in a tab, and after some time I come back to this tab and try to use it for another navigation within the app, the app responds with doc viewer progress bar indicating the document is being loaded, but it never actually loads the doc and remains in this state forever. Reloading the page resolves the issue.

When I was looking through the Google Analytics (GA) data today, I noticed that there was a spike in errors just after the holidays:

Google Analytics report

Notice how the spike starts just around Jan 7 when most people got back from holidays, and relatively quickly things come back to normal within the next few days.

If we look into the error causes, you’ll see that the main root cause is failing to download certain JS chunks, mainly the “toc-module” chunk (there are some others if you go into the report and look at the long tail of errors, but they are less common).

This makes me believe that the problem I observed in the past and this error spike after holidays are related.

Here is my interpretation of the events:

• many people were on angular.io before holidays and visited only the home page but not any api/guide doc (the toc-module case), and others visited other pages as well and their case is captured in the long tail of errors other than “toc-module”.
• these people left their app open, then came back around Jan 7 and tried to use the app for a new navigation
• in the meantime we deployed many new versions of angular.io, changing the fingeprints of chunks
• when the new navigation occured in the long-running app, the app (webpack module loader) tried to download the chunk for the missing code (e.g. toc-module)
• the server however no longer hosted that chunk because we redeployed angular.io with new versions since then and returned 404
• it’s uncommon that we fail to load code in this way, so the app just paniced and got stuck in the “loading document” state.
• user had to reload the page to recover and since reloading helped, people just shrug and moved on without reporting the problem...

There are at least three problems we need to fix:

• the module loading errors should not cause the app to freak out, we should either display the snack bar telling the user that there was an error and they should try to reload, or we should consider reloading the page automatically (but ensure we don’t end up in an infinite loop of reloads if a reload doesn’t cause the app to recover)
• look into why “toc-module” fails so frequently and consider prefetching and caching it along with the main chunk
• we should somehow deal with the client-server version skew (have service-worker cache all chunks lazily, host old chunk versions, etc)

UPDATE(2021-09-20):
See #28114 (comment) for an explanation of the problem.