Цель этой страницы — предоставить дополнительные советы о том, как решить проблему оптимизации производительности рабочих веб-сайтов.

Похоже, что вы пытались разделить фрагменты пакета на веб-сайте React Production, используя React.lazy} andsuspense} в React; однако это не привело к ожидаемому улучшению показателя веб-производительности.

Но почему это так?

Учитывая, что для вашего производственного сайта требовалось что-то дополнительное.....

Недавно мне поручили улучшить работу производственного веб-сайта. Я изначально думал, что надо ленивее загружать каждый маршрут, но вскоре понял, что это уже сделано.

Я также начал задаваться вопросом, что будет дальше.

Я установил плагин анализатора пакетов веб-пакетов и после этого попытался проанализировать каждую часть. После этого у меня появилось много предложений о том, как повысить производительность.

Main.bundle.js
Размер основного пакета был слишком большим, что привело к увеличению времени загрузки и времени анализа.

Как сломать main.bundle.js?
в моем случае в моем основном пакете есть много json, что связано с переводом, который увеличил размер основного пакета на 1,5 МБ.

Я убрал перевод, используя отложенный импорт из пакета main.js. Это дает 40% оптимизации производительности. но это еще не сделано, так как мы достигли только оценки производительности маяка с 25 до 35.

затем я начал искать другие потенциально большие файлы.

Одним из них является moment js, в котором есть множество локалей, которые мы не использовали для нашего сайта. Замена moment js облегченной библиотекой — один из способов исправить это, но это потребует дополнительных модификаций кода и увеличит мою рабочую нагрузку по тестированию всего веб-сайта (чего я раньше не делал), что может привести к большему количеству ошибок. затем я принял решение выяснить, как избавиться от этих нежелательных областей; к счастью, плагин для веб-пакета уже был доступен. Мне удалось минимизировать размер файла moment.js, используя этот плагин [ContextReplacementPlugin].

Следите за обновлениями, скоро появится еще много... Спасибо