Как развернуть приложение JS с разделением кода, чтобы убедиться, что предыдущие версии приложений не ломаются - PullRequest
2 голосов
/ 23 апреля 2020

У меня есть простое приложение PWA, созданное с помощью Webpack и React. У него есть настройка разделения кода при динамическом импорте c (например, React.lazy(() => import('./SomeRoute'))), поэтому разные маршруты получают разные пакеты JS, например: main.bundle.js, someRoute.bundle.js

Теперь представьте себе ситуацию: я развертываю новая версия приложения, которая вообще не имеет SomeRoute или содержит что-то совершенно другое. Приложение будет пытаться достичь https://myapp.com/someRoute.bundle.js и потерпит неудачу, так как этого актива больше нет. Перезагрузка приложения, очевидно, помогла бы, но, тем не менее, это не будет приятным поведением.

Одним из решений, которое я вижу, было бы включение контента ha sh во все активы, так что это будет someRoute.1e4f.js а затем размещать все эти разные версии приложений в течение некоторого периода времени , пока все пользователи приложения не получат последнюю версию приложения.

Если это путь к go, тогда я не буду не знаю, как это организовать. В настоящее время я размещаю свой PWA на vercel.com (например, Zeit), и я никогда не видел, есть ли у них возможность сохранить активы из прошлых сборок. Конечно, я мог бы зафиксировать все артефакты сборки в git, но это очень быстро раздуло бы репо.

Другим решением было бы предварительно выбрать маршруты всех приложений при начальной загрузке и сохранить их кэшировали в сервисном работнике. Это, очевидно, помогло бы, но это сводит на нет цель разделения кода, чтобы уменьшить использование трафика c в сети.

Другое решение - обнаружить 404 на JS порциях и принудительно перезагрузить приложение . Это было бы очень неприятным UX для некоторых пользователей.

Так как с этим справляются серьезные приложения? Я удивлен, как такой существенной проблеме не хватает внимания.

1 Ответ

0 голосов
/ 25 апреля 2020

Я провел некоторые исследования по этой теме c, и действительно, добавить нечего, кроме того, что я уже упоминал в этом вопросе. Я объяснил это более подробно в этой статье: http://dimaip.github.io/2020/04/25/deploying-apps-with-code-splitting/

...