Хочу поделиться опытом ускорения сайта на WordPress — так, как делаю это сам. На Kwork.com на днях пришёл необычный заказ: вместо привычных вопросов «Справитесь? Выведете в зелёную зону?» клиент без лишней переписки сразу оформил заказ — скорее всего, изучил отзывы.
Скорость загрузки — это не просто технический параметр. От неё напрямую зависит конверсия, поведенческие факторы, SEO и в целом впечатление пользователя. Когда я взялся за ускорение сайта expertizamockva.ru, я решил провести всё так, как делаю это для клиентов: системно, поэтапно и с упором на результат.
Первичная диагностика: картина до оптимизации
Я всегда начинаю с просмотра консоли разработчика и замеров в Google PageSpeed Insights, Loading Express и иногда прочих сервисов. Ну и так же визуально просматриваю сайт насколько удобно мне по нему серфить.
Результаты для expertizamockva.ru были ожидаемыми:
- PageSpeed Mobile едва дотягивал до 69;
- LCP (главный показатель скорости) был около 29 секунд;
- изображения тянулись «как есть» — в оригинале, иногда по 3000px вместо кропов 300px;
- скрипты блокировали отрисовку страницы;
- кэш на уровне WordPress не работал вовсе.
📸 Скриншот PageSpeed до оптимизации — ссылка на результат
📸 Скриншот loading.express до оптимизации — ссылка на результат
Базовые шаги: фундамент для ускорения
Переход на WP Rocket
У меня был опыт с LiteSpeed Cache, но под конкретную задачу я выбрал WP Rocket. Почему?
- он проще в настройке;
- идеально подходит для небольших проектов;
- сразу даёт хороший прирост без долгих экспериментов.
Включил кэш страниц, активировал минификацию и «Delay JS Execution», исключил ключевые скрипты (jQuery, slick.js, Yandex.Metrika).
Оптимизация изображений: WebP и picture
Тут пришлось подзаморочиться и переписать все скрипты, все файлы страниц и css, так как видно, что верстальщик был не опытный и сделал всё неправильно. А что касается картинок, то грубо говоря, где картинка должна была быть размером 200х300 px, к объекту пришили размер 2500х3500 px, тем самым увеличив размер в разы.
Сильная сторона любой оптимизации — работа с изображениями. Я сделал:
- собственные кропы (
service_card,expert_thumbи др.); - функцию
exmo_picture_by_url, которая формирует<picture>с WebP и AVIF; - замену
background-imageи статичных<img>на адаптивные<picture>соsrcset; - ленивую загрузку через WP Rocket.
Результат: вес страницы упал более чем в 9 раз.
JavaScript и слайдер
Мой кастомный код перенесён в main.js. Для слайдера Slick я:
- подключаю библиотеку только на главной;
- отложил её загрузку;
- добавил защиту от конфликтов с «Delay JS».
Работа со сторонними скриптами
Отдельная история — счётчики и аналитика.
Yandex.Metrika всегда тормозит загрузку. Я переписал её подключение так, чтобы tag.js подгружался только после первого действия пользователя (scroll, click, tap).
Теперь сайт грузится молниеносно, а данные в аналитику всё равно поступают.
Результаты: до и после
📸 Скриншот PageSpeed после оптимизации — ссылка на результат
📸 Скриншот loading.express после оптимизации — ссылка на результат
На глаз разница ощущается моментально — сайт открывается без «белых экранов», изображения догружаются плавно, скрипты не мешают.
Оптимизация WordPress — это всегда комплекс:
- плагин кэширования (WP Rocket / LiteSpeed);
- WebP +
<picture>; - Lazy Load и отложенный JS;
- контроль сторонних скриптов.
Всё это вместе даёт результат, который видно сразу.
Но самое интересное, что в каждом сайте всегда разные проблемы, и каждому из них всегда требуется персональный подход и стек технологий.
Заключение
Я показал реальный кейс: сайт был «тяжёлым» и медленным, а стал лёгким, быстрым и удобным. И это не магия — это правильная методология.
⚡ Если вам тоже нужно ускорить сайт на WordPress — знайте: я профессионально занимаюсь оптимизацией и довожу проекты до реальных измеримых результатов.
Продолжить по теме: техническая поддержка сайтов.
