Скорость загрузки сайта: что тормозит и как ускорить

Скорость загрузки — один из немногих параметров сайта, который одинаково важен и для людей, и для поисковых систем. Посетитель не станет долго ждать, пока откроется страница услуги: он вернётся в выдачу и выберет другой сайт. Поисковые системы учитывают удобство страниц, в том числе через метрики Core Web Vitals.

Хорошая новость: большинство проблем со скоростью типичны и решаемы. Разберём, что чаще всего замедляет сайты и что с этим делать.

Как измерить скорость

Прежде чем что-то исправлять, зафиксируйте исходное состояние:

• PageSpeed Insights — показывает лабораторную оценку и, если хватает данных, реальные показатели пользователей;
• инструменты разработчика в браузере, вкладка «Сеть» — видно, какие файлы загружаются, сколько они весят и сколько времени занимает каждый;
• отчёт Core Web Vitals в Search Console — группирует страницы с проблемами.

Проверяйте мобильную версию: на смартфонах с мобильным интернетом проблемы заметнее всего.

Причина 1. Тяжёлые изображения

Это самая частая проблема. Фотография с телефона или фотостока весит несколько мегабайт, а на странице отображается в размере 800 пикселей. Браузер всё равно скачивает полный файл.

Что делать:

• уменьшать изображения до реально нужного размера;
• использовать формат WebP — при том же качестве он обычно заметно легче JPEG и PNG;
• готовить несколько вариантов размера и отдавать подходящий через srcset;
• включать ленивую загрузку для изображений ниже первого экрана;
• указывать размеры, чтобы не было смещения вёрстки.

На моих проектах загруженные через админ-панель картинки автоматически конвертируются в WebP и уменьшаются — редактору не нужно об этом думать. Подробнее — в статье об оптимизации изображений.

Причина 2. Лишние скрипты

Каждый подключённый скрипт — это загрузка, разбор и выполнение кода. Виджеты чатов, несколько систем аналитики, пиксели рекламных кабинетов, слайдеры, анимационные библиотеки — вместе они могут весить больше, чем вся остальная страница.

Что делать:

• провести ревизию: что реально используется, а что осталось от прошлых экспериментов;
• подключать скрипты с атрибутами defer или async;
• загружать тяжёлые виджеты только после взаимодействия пользователя или с задержкой;
• не подключать целую библиотеку ради одной функции.

Причина 3. Шрифты

Пять начертаний трёх шрифтов — это несколько сотен килобайт, которые нужны ещё до отображения текста.

Что делать:

• оставить только используемые начертания;
• подключать шрифты с font-display: swap, чтобы текст отображался сразу системным шрифтом;
• использовать формат WOFF2.

Причина 4. Медленный сервер

Если сервер долго формирует страницу, никакая оптимизация картинок не поможет. Признак — большое время до получения первого байта ответа.

Что делать:

• кешировать готовые страницы и тяжёлые запросы;
• оптимизировать запросы к базе данных: убрать повторяющиеся запросы, добавить индексы;
• использовать актуальную версию PHP или другой платформы — новые версии заметно быстрее старых;
• выбрать хостинг с достаточными ресурсами. О выборе — в статье как выбрать хостинг для сайта.

Причина 5. Нет кеширования статических файлов

Стили, скрипты и изображения редко меняются. Если браузеру не разрешено их кешировать, он скачивает их заново при каждом переходе.

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

Причина 6. Сжатие не включено

Текстовые файлы — HTML, CSS, JavaScript — хорошо сжимаются. Включение сжатия gzip или brotli на сервере уменьшает объём передаваемых данных в несколько раз и почти ничего не стоит.

Причина 7. Тяжёлая платформа

Сайты на конструкторах и перегруженных шаблонах часто подключают десятки ненужных скриптов и стилей на каждой странице. Плагины для каждой мелочи тоже добавляют вес. В таких случаях оптимизация упирается в ограничения платформы.

Иногда честнее признать, что быстрее и дешевле сделать новый лёгкий сайт, чем бесконечно оптимизировать старый. Особенно если вместе со скоростью нужно исправить структуру и SEO.

Причина 8. Сторонние сервисы и встраивания

Карта, встроенная на каждую страницу, видео с внешнего хостинга на первом экране, ленты соцсетей — всё это подгружает чужие скрипты и стили, на скорость которых вы не влияете. Карту достаточно показать на странице контактов, а видео можно заменить превью-картинкой, которая загружает проигрыватель только после нажатия. Такой приём почти не меняет внешний вид страницы, но заметно облегчает её загрузку.

Порядок работ

1. Измерить скорость ключевых страниц: главной, услуг, популярных статей.
2. Оптимизировать изображения — обычно это самый большой выигрыш.
3. Провести ревизию скриптов и шрифтов.
4. Настроить кеширование и сжатие.
5. Проверить скорость ответа сервера и запросы к базе.
6. Измерить снова и сравнить.

Итог

Быстрый сайт — это не только приятные баллы в PageSpeed, но и больше заявок: люди остаются, читают и связываются. Я закладываю скорость при разработке сайтов — лёгкая вёрстка, серверный рендеринг, автоматическая оптимизация изображений — и ускоряю существующие сайты в рамках поддержки и доработки. Если ваш сайт загружается медленно, оставьте заявку — проведу проверку и предложу план ускорения.