Эта статья дала мне невероятное представление о том, как загружается моя страница. Просто сделав асинхронный Javascript, я увидел двукратное улучшение времени загрузки. Вот краткий список вещей, которые вы должны сделать с первого дня, чтобы ваша страница загружалась очень быстро. Я не проверял эту теорию, но думаю, что выполнение этих задач из первого дня невероятно поможет в будущем. Это поможет вашей команде развить мышление, ориентированное на производительность, а также предотвратит дорогостоящие рефакторинги в будущем. Некоторые из этих элементов можно легко выполнить, просто изменив конвейер сборки, не переписывая код.

  1. Загрузить ВСЕ Javascript асинхронно
  2. Объединить и минимизировать весь Javascript
  3. Упростите структуру HTML
  4. Мне нужно упростить CSS и удалить все ненужные или повторяющиеся правила CSS.
  5. Стремитесь достичь DomContentLoad за 500 мс ‹ — это когда весь HTML и Javascript загружен и проанализирован браузером. На экране еще ничего не нарисовано, но все готово
  6. Уменьшите количество Javascript в событии «document.ready». Все это запустится после того, как браузер подготовит страницу в памяти. Выполняйте как можно больше Javascript как можно позже. Минимизируйте количество изменений макета, создаваемых вашим Javascript. Это может произойти вручную путем изменения размера div или из-за того, что ваш Javascript инициировал загрузку изображения. Большие изображения долго загружаются и, следовательно, запускают ретрансляцию после их загрузки.
  7. Стремитесь к загрузке страницы менее 1000 мс ‹ — здесь загружены все ресурсы, страница нарисована и готова к взаимодействию с пользователем.