Низкая скорость загрузки сайта

Появляются блоки. Картинки подгружаются по очереди, шрифт перескакивает, макет дергается. Пытаюсь читать, но буквы пляшут.

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

Еще одна попытка — корзина открывается через два рывка. Модальное окно вываливается, скрывает контент, потом исчезает. Похоже на игру с плохим пингом.

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

В конце я закрываю вкладку до того, как вижу товар полностью. У меня нет времени подстраиваться.

Когда критично, а когда нет

• Мобильный e-commerce, регионы с нестабильной связью.
• SEO-трафик: скорость влияет на позиции и отказ.
• Первые визиты, когда доверие еще не заработано.
• Страницы оплаты и регистрации, где важен ритм.

• Внутренние кабинеты, где пользователи «захвачены» задачей.
• Ниши с отсутствием альтернатив (редкие B2B-сервисы).
• Узкие профессиональные инструменты, где ценность перевешивает дискомфорт.

Что об этом говорят пользователи

• Да, иногда тормозит. Бывает.
• Ну, как везде, ничего необычного.
• Показалось, что долго, но я подождал.
• Не знаю, у меня интернет плохой.

• Открыл карточку товара на iPhone 12, Safari, 4G. До первого изображения ждал примерно 4–5 секунд, на 6-й закрыл вкладку и вернулся в поиск.
• С ноутбука, Chrome, Wi‑Fi. Каталог открывается за 2–3 секунды, но фильтры после клика зависят, кнопки не реагируют около секунды. Дважды кликал из-за паузы.
• На лендинге баннер появился быстро, а текст и кнопка — только через пару секунд. Думал, что это картинка без ссылки. Прокрутил вниз и потерял смысл первого экрана.
• На оформлении заказа после ввода адреса страница думала 3–4 секунды. Я решил, что форма зависла, и обновил. Данные потерялись, ушёл.
• На Android, 3G. Видео на первом экране автозапускается, всё тормозит. Я не понял, что нужно сделать, просто прокрутил и ушёл.

Решение проблемы

• Определите цель. Для мобильного трафика держите LCP до 2,5 с, INP до 200 мс, TTFB до 0,8 с для 75‑го перцентиля.
• Измеряйте в реальности. Подключите RUM с Web Vitals. Сегментируйте по устройствам, сетям, странам. Найдите самые трафиковые и проблемные шаблоны.
• Сократите лишнее. Удалите неиспользуемые библиотеки, плагины, пиксели, виджеты. Оставьте то, что даёт ценность. Всё второстепенное — после первого взаимодействия.
• Ускорьте первый пиксель. Включите CDN, кеш на уровне сервера и браузера. Сожмите ответы Brotli. Перейдите на HTTP/2 или HTTP/3. Уберите лишние редиректы. Настройте preconnect и DNS‑prefetch к критичным доменам.
• Покажите смысл раньше. Вынесите критический CSS инлайн. Остальной CSS грузите неблокирующе. Скрипты — defer или async. Расставьте приоритеты загрузки: сначала верх экрана, потом остальное.
• Оптимизируйте медиа. Используйте WebP/AVIF, корректные размеры, srcset и sizes. Подключите lazy‑load для изображений и видео. Отключите автоплей на первом экране.
• Упорядочьте шрифты. WOFF2, сабсеты, только нужные гарнитуры и начертания. font-display: swap. Хостите локально.
• Снизьте чаты и счётчики. Минимизируйте сторонние скрипты. Загружайте их после основного контента. Контролируйте их вес и влияние.
• Прокачайте бэкенд. Ускорьте TTFB: кэш запросов, индексы БД, сжатие, keep‑alive. Объединяйте запросы, уберите N+1. В API — пагинация и разумные таймауты.
• Проверьте руками и инструментами. WebPageTest, Lighthouse, профилировщик в Chrome. Тестируйте на слабых устройствах и медленных сетях.
• Введите бюджеты производительности. Фиксируйте лимиты по весу, запросам, LCP. Блокируйте релизы, которые их нарушают. Настройте алерты, дашборды. Назначьте владельца скорости.
• Следите за регрессами. Еженедельно просматривайте метрики. Чистите медиа и код. Пресекайте «ещё один скрипт» без пользы. Скорость — постоянная работа, а не разовая задача.

Гипотезы для роста конверсии

• Если сократить LCP на карточке товара до появления фото и цены на первом экране, то конверсия в добавление в корзину может увеличиться за счёт того что пользователь сразу видит, что покупает.
• Если убрать сторонние скрипты с лендинга и загружать их после первого взаимодействия, то конверсия в отправку формы может увеличиться за счёт того что форма становится доступна без задержки.
• Если включить CDN и кеширование для каталога, то конверсия в просмотр карточек может увеличиться за счёт того что переходы между страницами происходят без ожидания.
• Если вынести критический CSS инлайн и отложить остальной, то конверсия в клик по первому экрану может увеличиться за счёт того что контент появляется быстрее и не прыгает.
• Если сжать изображения до WebP/AVIF и подставлять размер по устройству, то конверсия в просмотр галереи может увеличиться за счёт того что фото открываются сразу и не мешают навигации.