Заказ на оптимизацию

Уменьшение размера сайта в 6 раз

Недавно обратилась знакомая с просьбой оптимизировать 4 похожих сайта.

Время загрузки сайтов было долгим, показатели тестов скорости — 0/100.

Результаты:

Снизил размер сайта в 6 раз: с 3 до 0.5 мб.
Уменьшил время загрузки: с 3.5 до 2 секунд.

Какие шаги были выполнены чтобы ускорения загрузки?

1. Разделение кода оформления. При переходе пользователя на сайт, код оформления будет грузиться не для всей страницы, а только для первой секции сайта. А спустя несколько секунд загрузится оформление и для остального сайта, это называют — критический css. Это позволяет отложить загрузку большого количества стилей при загрузке сайта.
2. Сжатие изображений. Вес изображений без оптимизации довольно большой, некоторые изображения сжимаются на 90% без потери качества, это делается за счет удаления системной информации из файлов изображений.
3. Объединение файлов скриптов и стилей. Чем больше файлов подключается к сайту, тем больше браузеру нужно сделать запросов для корректного отображения сайта, каждый запрос — время, поэтому нам надо упростить работу браузеру и объединить все скрипты в 1 файл и все стили в 1 файл. На каждом из 4 сайтов было по 12 файлов скриптов и по10 файлов стилей. Я сделал по одному.
4. Минификация кода. Код нужно сжимать, делается это с помощью удаления пробелов, сокращения имен переменных, программы для сжатия пытаются по максимуму сократить количество символов в коде. Минификация кода позволяет сжать файл на 10−40% от начального размера.
5. Включение надстройки сжатия и кэширования сайта. Сжатие сайта позволяет уменьшить размер сайта еще процентов на 70. Кэширование сайта сохраняет в своей памяти файлы, которые не изменились и которые не требуется загружать каждый раз. Обе эти настройки были выключены на сервере.

До оптимизации:

Размер сайта: 3 мб.
Время загрузки: 3.5 секунды

После оптимизации:

Размер сайта: 0.5 мб.
Время загрузки: 2 секунды