Разделить одностраничное приложение React на несколько одностраничных приложений для более быстрой загрузки?
Сначала это может показаться странным, но, пожалуйста, дочитайте до конца. Обычно одностраничные приложения (SPA) состоит из одного файла index.html и нескольких сценариев JS, а маршрутизация выполняется с помощью Javascript с такими библиотеками, как React Router, поэтому первая загрузка выполняется медленно, поскольку вы загружаете все приложение. Итак, с появлением Progressive Web Apps и Service Workers не лучше ли разделить одностраничное приложение на несколько SPA для более быстрой загрузки? Состояние аутентификации и другое общее состояние может храниться в локальном хранилище, как это делает, например, Firebase. Какие проблемы с этим подходом?
Ответы 1
Как уже упоминалось в комментарии Сэма, вы должны использовать разделение кода, чтобы ускорить загрузку вашего приложения.
Вы можете начать с кода, разделяющего ваше приложение по маршрутам, и наращивать его оттуда.
Попробуйте использовать React.Suspense и React.lazy, это должен быть довольно быстрый процесс, и вы увидите немедленные результаты. Следите за вкладкой «Сеть» в инструментах разработчика, и вы увидите, как загружаются разные фрагменты при навигации по вашему приложению.
Мы прошли полный круг. Вам не нужно загружать все приложение решениями для рендеринга на стороне клиента. Google
code splittingдля получения дополнительной информации.