Скорость сайта — не «приятный бонус», а фактор ранжирования. Google и Яндекс учитывают скорость загрузки. И пользователи не ждут. Каждая лишняя секунда — минус 7% конверсии. Разберём 12 техник, которые дают реальный результат.
1. Кэширование HTML-вывода
Если страница не меняется — отдавать её из кэша, а не генерировать заново. Экономия — 80-95% времени ответа.
$cacheFile = 'cache/page-' . md5($url) . '.html';
if (file_exists($cacheFile) && filemtime($cacheFile) > time() - 3600) {
readfile($cacheFile);
exit;
}
ob_start();
// ... обычный рендеринг
file_put_contents($cacheFile, ob_get_contents());
ob_end_flush();
2. Оптимизация базы данных
Медленные SQL-запросы — главная причина тормозов.
- Индексы на часто используемые поля (WHERE, JOIN, ORDER BY)
- EXPLAIN для анализа запросов
- LIMIT там, где не нужны все строки
- Избегать SELECT * — только нужные поля
- Не запрашивать в цикле — только батчем
3. Prepared statements
Запрос компилируется один раз, выполняется много. Быстрее обычных строк на 10-30% при массовых операциях.
4. Отложенная загрузка картинок
Атрибут loading="lazy" — браузер загружает только то, что видно на экране. Экономия трафика до 60%, ускорение рендеринга в 2 раза.
<img src="photo.jpg" alt="..." loading="lazy">
5. WebP вместо JPG/PNG
WebP даёт тот же визуальный результат при весе в 2-3 раза меньше. Конвертировать можно на лету или заранее.
6. Сжатие CSS и JS
Минификация (удаление пробелов, комментариев) — минус 40% размера. Плюс сжатие gzip/Brotli на сервере — минус ещё 70%.
Настройка в .htaccess:
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/css application/javascript
</IfModule>
7. Объединение файлов
5 CSS-файлов = 5 HTTP-запросов = +200 мс. Один объединённый — быстрее.
8. CDN для статики
Картинки, CSS, JS отдавать через CDN — они кэшируются на серверах по всему миру. Пользователь из Сибири получит файл из Новосибирска, а не из Амстердама.
9. HTTP/2 или HTTP/3
Мультиплексирование — браузер грузит десятки файлов параллельно по одному соединению. В 2-3 раза быстрее HTTP/1.1.
10. Preconnect и Preload
Указать браузеру, что скоро понадобится — заранее установить соединение с CDN шрифтов или картинок.
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="dns-prefetch" href="https://cdn.site.ru">
11. Критический CSS inline
CSS для первого экрана — прямо в `
`. Остальное — с defer. Страница показывает контент мгновенно, а не ждёт полной загрузки CSS.12. Отключение неиспользуемого
Проверь, что нет:
- Лишних скриптов аналитики
- Устаревших библиотек (jQuery не нужен, если не используешь)
- Chat-виджетов с внешних серверов
Что даёт результат
Из 12 техник:
- Топ-3 (кэш, индексы, сжатие) — минус 70% времени ответа
- Средние (lazy, WebP, CDN) — минус ещё 15%
- Остальные — по 2-5% каждая
Реальный результат: TTFB с 800 мс падает до 80-150 мс. Lighthouse с 40 до 90+. Core Web Vitals — все зелёные.
Как проверить
- PageSpeed Insights — Google рекомендует
- GTmetrix — детальный отчёт
- WebPageTest — из разных регионов
Ориентир: LCP (Largest Contentful Paint) до 2.5 с, FID до 100 мс, CLS до 0.1.