Skip to content

Все для WordPress, веб-розробки — і не тільки

🚀 Як зменшити час завантаження сторінки WordPress

🚀 Як зменшити час завантаження сторінки WordPress

Повільний сайт на WordPress втрачає відвідувачів, позиції у видачі та гроші. Швидкість сторінки входить до сигналів ранжування Google, Core Web Vitals з 2021 року стали частиною алгоритму. Планка, 2,5 секунди за LCP (Largest Contentful Paint), кожна зайва секунда зрізає конверсію на 4-7% за даними Portent.

Хороша новина: WordPress можна розігнати до паспортних 1-2 секунд без магії та переписування сайту з нуля. У цьому матеріалі 13 робочих прийомів від вибору хостингу до винесення сміття з бази даних, кожен перевірений на реальних проєктах.

💡 Швидкий огляд:

  • Оберіть керований WordPress-хостинг або якісний VPS, сервер відповідає за 40-50% швидкості (дослідження Kinsta)
  • Увімкніть кешування сторінок і підключіть CDN, статика роздається з найближчого до користувача вузла
  • Стискайте та конвертуйте зображення у WebP/AVIF перед завантаженням на сайт
  • Мініфікуйте CSS, JS і HTML, увімкніть Gzip або Brotli на сервері
  • Пройдіться плагінами: вимкніть невикористовувані, замініть дублювальні
  • Перенесіть скрипти у footer, таблиці стилів залиште в head — це змінює сприйняття швидкості

Вибір хостингу: фундамент, з якого все починається

Сервер, головний фактор часу відповіді (TTFB, Time to First Byte). Якщо хостинг перевантажений або застарілий, решта оптимізацій дадуть лише символічний приріст. Саме тому рекомендація «почніть із хостингу» не кліше, а інженерна правда.

Керований WordPress-хостинг (WP Engine, Kinsta, Cloudways) дає три речі з коробки: серверну оптимізацію, вбудоване кешування та CDN. Звичайний shared-хостинг за $3-5 на місяць такого не запропонує. Різниця в TTFB: 300-800 мс у дешевого shared проти 80-150 мс у керованого (дані Kinsta, 2025).

VPS або виділений сервер дає більше контролю, але потребує налаштування. Обирайте NVMe-диски та щонайменше 2 ГБ ОЗП під сайт середнього навантаження.

Як перевірити хостинг? Відкрийте PageSpeed Insights, подивіться на TTFB. Значення вище 600 мс, привід змінювати тариф або провайдера. GTmetrix у вкладці Waterfall покаже затримку сервера перед першим байтом.

Кешування та CDN: два прискорювачі, які працюють у парі

Кешування — це збереження готової HTML-копії сторінки. Замість збирання під час кожного візиту (PHP + база + плагіни) сервер віддає статичний HTML. Для WordPress це дає приріст швидкості у 2-5 разів.

Три плагіни кешування, перевірені часом:

WP Rocket (преміум, від $59/рік), золота середина: кешування, мініфікація, lazy load і відкладене завантаження JS в одному плагіні. Якщо бюджет дозволяє, ставте його і закривайте більшість пунктів одним встановленням.

Налаштування плагіна кешування WordPress в адмін-панелі

CDN (Content Delivery Network), мережа серверів по світу. Сайт в одному дата-центрі; відвідувач з іншого континенту втрачає час на оптоволокні. CDN вирішує це: статичні файли розносяться по вузлах і віддаються з найближчого до користувача сервера.

Cloudflare, найпопулярніший безплатний CDN для WordPress. Реєстрація, зміна DNS, і базове кешування ввімкнено. jsDelivr, альтернатива для зовнішніх бібліотек: безплатно, мульти-CDN, авто-мініфікація.

Оптимізація зображень: важкі картинки, ворог номер один

Зображення займають у середньому 45-60% ваги сторінки WordPress (HTTP Archive, 2025). Неоптимізована фотографія з камери може важити 3-7 МБ, стільки ж, скільки весь решта сайту. Правило просте: жодне зображення не потрапляє на сайт без стиснення і конвертації в сучасний формат.

Порівняння форматів зображень WebP AVIF і JPEG

Інструменти та плагіни, які роблять це автоматично:

  • ShortPixel Image Optimizer, стискає PNG, JPEG, GIF і конвертує у WebP/AVIF на льоту, безплатний ліміт 100 зображень на місяць.

  • EWWW Image Optimizer, оптимізація на вашому сервері без обмежень за кількістю, підтримує AVIF з 2024 року.

  • Imagify, від розробників WP Rocket, три рівні стиснення, безплатно 20 МБ на місяць.

Формати: WebP стискає на 25-35% краще за JPEG. AVIF ще на 20-30% ефективніший плюс HDR, але кодується повільніше. Якщо сервер дозволяє, обирайте AVIF; потрібна швидкість, WebP.

Не завантажуйте зображення більшого розширення, ніж потрібно. Картка посту 400×300 не потребує фото 2000×1500, масштабування браузером лише гальмує. Обрізайте до цільових розмірів перед завантаженням. Докладніше, у нашому огляді десяти рішень.

Gzip і Brotli: стиснення на рівні сервера

Gzip, ветеран вебстиснення з 1990-х. Сервер стискає HTML, CSS, JS і SVG перед надсиланням, браузер розпаковує. Розмір файлів зменшується на 60-80%.

Brotli, наступник Gzip від Google (2015). Стискає на 15-25% краще за того самого часу розпакування. Якщо сервер підтримує, вмикайте Brotli.

Способи ввімкнення:

  • Через плагін кешування: WP Rocket, W3 Total Cache, WP Super Cache вмикають стиснення однією галочкою в налаштуваннях.
  • Через.htaccess (Apache): додайте директиви AddOutputFilterByType DEFLATE для потрібних MIME-типів.
  • Через Nginx: модуль ngx_http_gzip_module (Gzip) або ngx_brotli (Brotli) у конфігурації сервера.

Старий метод через /wp-admin/options.php (поле gzipcompression) видалено з ядра WordPress багато років тому. Використовуйте серверне стиснення або плагін.

Мініфікація: приберіть зайві байти з коду

Мініфікація — це видалення пробілів, переносів рядків, коментарів і незначущих символів з HTML, CSS і JavaScript. Браузеру байдуже, наскільки гарно відформатований код, йому важлива валідність і швидкість парсингу.

Один плагін закриває всі три напрями:

  • Autoptimize, мініфікує HTML, CSS і JS; агрегує та вбудовує критичні стилі. Безплатний, з активною базою встановлення понад 1 мільйон сайтів. Чудово товаришує з плагінами кешування.

  • WP Rocket (преміум) містить мініфікацію з коробки, разом із кешуванням, стисненням і лінивим завантаженням.

Типовий виграш: 15-25% розміру CSS і 20-35% розміру JS (заміри GTmetrix, 2025). На мобільному 3G це економить 0,3-0,8 секунди.

Таблиці стилів, у head, скрипти, перед закриваючим body

Порядок завантаження ресурсів безпосередньо впливає на сприйняття швидкості (рекомендація Google щодо Core Web Vitals):

  • **CSS, у **<head>: стилі завантажуються до рендерингу. Стилі внизу сторінки = «голий» HTML без оформлення (FOUC, Flash of Unstyled Content) — це псує враження сильніше за зайві 200 мс завантаження.

  • **JavaScript, перед **</body>: скрипти блокують рендеринг. Віджети, трекери та зовнішні API повинні завантажуватися після відтворення контенту. Користувач не натисне кнопку «Поділитися», поки не прочитав текст.

Схема порядку завантаження CSS і скриптів в HTML-документі

Додатково використовуйте атрибути defer (скрипт виконується після завантаження HTML, але в порядку черги) та async (скрипт виконується щойно завантажився, порядок не гарантовано) для зовнішніх скриптів. Для Google Analytics, Facebook Pixel і подібних, defer. Для незалежних віджетів, async.

Обмежте зовнішні скрипти: кожна кнопка чогось варта

Кожен зовнішній скрипт — це HTTP-запит до стороннього сервера. Один запит: 50-200 мс, десять скриптів: секунда і більше. На повільних з'єднаннях каскад затримок розтягується на 3-5 секунд.

Типові джерела зовнішніх скриптів:

  • Кнопки соцмереж (Facebook, Twitter, Pinterest)
  • Відеоплеєри (YouTube, Vimeo, використовуйте loading="lazy" або facade)
  • Системи коментарів (Disqus)
  • Живий чат (JivoSite, Intercom, Tidio)
  • Зовнішні шрифти (Google Fonts, хостіть локально)
  • Форми підписки, попапи, A/B-тестування

Підхід: залиште тільки те, що впливає на бізнес. Pingdom Speed Test показує waterfall запитів, сортуйте за тривалістю і видаляйте найповільніші.

Ревізія плагінів: менше означає швидше

Плагіни, водночас сила і слабкість WordPress. Кожен активний плагін додає свої CSS та JS на кожну сторінку, навіть якщо його функціональність там не потрібна. Деякі роблять HTTP-запити до зовнішніх API під час кожного завантаження.

Принципи роботи з плагінами:

  • Видаліть невикористовувані. Плагін імпорту демоданих після запуску сайту? Видаліть.

  • Не дублюйте функціональність. Yoast SEO і Rank Math не потрібні одночасно.

  • Замініть плагін кодом у functions.php дочірньої теми, якщо це кілька рядків. Гайд із дочірніх тем.

  • Залиште якісні: відомі розробники, регулярні оновлення. Плагін без оновлень два роки, червоний прапорець.

Як правильно почистити плагіни на сайті WordPress, окремий матеріал із покроковою інструкцією.

Тема WordPress: якість коду має значення

Вибір якісної теми WordPress в адмін-панелі

Погано написана тема зводить нанівець усі оптимізації. Типові проблеми: десятки невикористовуваних скриптів, гігантські бібліотеки заради однієї анімації, шрифти в чотирьох накресленнях замість двох, неоптимізовані фонові зображення.

Критерії швидкої теми:

  • Активні оновлення: тема без оновлень понад рік, ризик для безпеки та швидкості.
  • Мінімалістичний дизайн: Kadence, GeneratePress, Astra, Blocksy, легкі конструктори, збираєте рівно те, що потрібно сайту.
  • Без жорсткої залежності від page builder-ів: якщо тема тягне пів інтернету скриптів — це не швидкість.

Дочірня тема дає змогу правити поведінку без втрати оновлень. Будь-який візуальний недолік виправляється кастомним CSS, а не зміною теми.

База даних: регулярне прибирання

WordPress зберігає все: пости, чернетки, ревізії, спам-коментарі, транзитні опції, сміття з кошика. З часом база даних розпухає, запити сповільнюються.

Кошик. За замовчуванням WordPress чистить кошик кожні 30 днів. Скоротіть до 7 днів, додайте в wp-config.php:

1define( 'EMPTY_TRASH_DAYS', 7 );

Якщо кошик не потрібен узагалі (контент видаляється остаточно й одразу):

1define( 'EMPTY_TRASH_DAYS', 0 );

Ревізії постів. Кожне автозбереження створює запис у wp_posts. Після року активного блогу ревізії можуть займати значну частину бази (за оцінками WP-Optimize, до 20-40% обсягу). Обмежте кількість:

1define( 'WP_POST_REVISIONS', 3 );

Інструменти очищення. Плагін WP-Optimize прибирає ревізії, спам, транзитні опції та оптимізує таблиці. Advanced Database Cleaner, альтернатива для тоншого налаштування.

Реклама на сайті: баланс між доходом і швидкістю

Рекламні мережі працюють через зовнішні скрипти. Google AdSense, медійні мережі, RTB-аукціони, усе це вантажиться із зовнішніх серверів і обтяжує сторінку на 1-3 секунди.

Що можна зробити:

  • Скоротіть кількість рекламних блоків. Два банери замість п'яти дають те саме охоплення за кращої швидкості.
  • Використовуйте локальні банери. Пряме посилання з оптимізованим зображенням працює швидше за зовнішній скрипт. Для відстеження переходів, Pretty Links (безплатний плагін скорочення та трекінгу посилань).
  • Ліниве завантаження реклами. Банери нижче першого екрана завантажуються лише під час скролу. Реалізується через атрибут loading="lazy" або плагіни на кшталт Ad Inserter.

Компроміс: текстове посилання на партнера дає менше кліків, ніж медійний банер, але практично не впливає на швидкість. Для блогів із доходом від контенту це робочий варіант.

HTTP-запити: менше файлів, вища швидкість

Кожен файл на сторінці (CSS, JS, шрифт, іконка, зображення) потребує окремого HTTP-запиту. HTTP/2 і HTTP/3 мультиплексують запити, але накладні витрати залишаються.

Швидкі перемоги:

  • Об'єднайте CSS і JS. Замість п'яти дрібних CSS-файлів, один. Замість десятка JS, один-два. Autoptimize автоматизує.
  • CSS-спрайти для іконок. Одне зображення замість двадцяти, двадцять зекономлених запитів.
  • Вимикайте стилі та скрипти точково. Плагін контактної форми потрібен лише на сторінці з формою. Asset CleanUp або Perfmatters вибірково вимикають CSS/JS.
  • Хостіть шрифти локально. Google Fonts, додатковий DNS-запит. Завантажте потрібні накреслення та роздавайте зі свого сервера.

Jetpack: вимкніть непотрібні модулі

Список модулів Jetpack з вимкненням невикористовуваних функцій

Jetpack від Automattic, швейцарський ніж: статистика, CDN для зображень, пов’язані пости, соціальні кнопки. Але кожен модуль додає скрипти та стилі. Увімкніть усе одразу, отримаєте зайві 200-500 мс.

Залиште 2-4 модулі, які реально використовуєте (Site Stats, Brute Force Protection). Решту вимкніть. На одному з наших проєктів це дало мінус 0,7 секунди завантаження.

І наостанок: стискайте, прибирайте зайве, починайте з фундаменту

Загальний принцип прискорення WordPress, мінімалізм. Не в сенсі «голий сайт без функцій», а в сенсі «нічого зайвого без усвідомленої причини». Кожен плагін — це ціна в мілісекундах. Кожне зображення — це байти. Кожен зовнішній скрипт — це залежність від чужого сервера.

Починайте з хостингу та кешування — це дасть 60-70% приросту. Потім пройдіться по зображеннях і мініфікації — це ще 20-25%. Решта, тонке налаштування, яке в сумі дає відмінний результат. Плагіни YouTube для WordPress допоможуть пришвидшити вставку відео, використовуйте відкладене завантаження замість прямого iframe.

⁉️🤔 Часті запитання

Скільки плагінів WordPress — це «забагато»?

Важлива не кількість, а якість. Двадцять добре написаних плагінів від перевірених розробників можуть навантажувати сайт менше, ніж три «кривих». Орієнтуйтеся не на число, а на waterfall у GTmetrix: якщо плагін додає понад 100 мс, подумайте, чи справді він потрібен.

Що краще: безплатний CDN від Cloudflare чи платний?

Безплатного Cloudflare достатньо для переважної більшості сайтів. Платні тарифи (від $20/міс) додають Polish (стиснення зображень), Mirage (оптимізація для мобільних), Argo Smart Routing. Якщо сайт заробляє і кожна секунда конверсії на вагу золота, апгрейд виправданий.

Чи можна обійтися без плагіна кешування?

Можна, якщо ви використовуєте хостинг із вбудованим кешуванням на рівні сервера (Kinsta, WP Engine, Cloudways через Varnish або Nginx FastCGI Cache). В інших випадках плагін кешування — це найшвидший спосіб прискорити сайт без правок коду.

Чи варто переходити на Brotli замість Gzip?

Так, якщо сервер підтримує. Brotli стискає помітно ефективніше за Gzip за порівнянного часу (докладні цифри, у розділі про Gzip і Brotli вище). Перевірте заголовки відповіді сервера: content-encoding: br означає Brotli, content-encoding: gzip означає Gzip. Якщо br немає, зверніться до хостера.

Як часто потрібно чистити базу даних WordPress?

Раз на місяць для активно оновлюваного сайту, раз на квартал для візитівки чи лендингу. Обов’язково робіть бекап бази даних перед кожним чищенням.

Що зробити просто сьогодні, щоб сайт на WordPress завантажувався швидше

Не чекайте вихідних і не відкладайте. Три кроки, які дадуть відчутний приріст швидкості в найближчі пару годин:

  • Увімкніть кешування. Встановіть WP Fastest Cache (безплатно), натисніть три галочки та збережіть. Приріст швидкості відчутний, майже гарантований.

  • Проженіть через аналізатор. Відкрийте GTmetrix або PageSpeed Insights, подивіться на TTFB і LCP. Якщо сервер відповідає довше 600 мс, пишіть хостеру або змінюйте тариф.

  • Видаліть сміття. Деактивуйте плагіни, які не використовували понад місяць. Очистіть кошик. Перевірте, скільки ревізій зберігається в базі.

Якщо після цих трьох кроків сайт усе ще завантажується довше 3 секунд, повертайтеся до повного списку прийомів і проходьте по порядку. Системний підхід завжди виграє в разових правок.