Чому сайт завантажується повільно і як це виправити
Як перевірити швидкість сайту, прочитати звіт PageSpeed Insights і вибрати, що виправляти насамперед. Із прикладом оптимізації шрифтів на одному з наших проєктів.
Редакція awakes.ai · · оновлено
Чому сайт завантажується повільно
Сайт завантажується повільно через затримку відповіді сервера, важкі зображення, шрифти, стилі або JavaScript. Щоб вибрати виправлення, перевірте потрібну сторінку в PageSpeed Insights: звіт допоможе відрізнити очікування сервера від завантаження ресурсів і роботи браузера.
Якщо сайт гальмує лише у вас, відкрийте його з іншого пристрою й іншої мережі. Порівняйте й інші сайти. Так можна помітити проблему з’єднання, браузера або пристрою. Швидке завантаження на іншому телефоні ще не доводить, що сайт добре працює в усіх відвідувачів.
Нижче — порядок перевірки, пояснення показників і приклади правок. Починати варто з причини затримки у вашому звіті: порядок розділів не задає черговості робіт.
Як заміряти швидкість і не обдурити себе
- 1
Відкрийте PageSpeed Insights
Вставте адресу сторінки в pagespeed.web.dev. Угорі можуть бути дані реальних відвідувачів, нижче — лабораторний тест Lighthouse з оцінкою від 0 до 100. Це різні вимірювання: бал тесту допомагає діагностиці, але не замінює досвід клієнтів.
Відкрити PageSpeed Insights → - 2
Перевірте мобільну й настільну версії
Мобільний тест імітує обмежені ресурси телефона й мережі. Настільний теж корисний, особливо якщо клієнти працюють із комп’ютера. Частки пристроїв дивіться у своїй аналітиці; мобільна індексація Google не означає, що сайт ранжують за мобільним балом Lighthouse.
- 3
Повторіть тест в однакових умовах
Для початку зробіть три прогони одного URL з одним профілем пристрою. Збережіть звіти, діапазон і медіану — середній за порядком результат. Розкид може залежати від мережі, навантаження, кешу й сторонніх скриптів; за кількістю балів причину не визначити.
- 4
Виберіть сторінки й перевірте дії
Перевірте головну, сторінку послуги або товару й шлях до заявки. Після правок повторіть ті самі тести та вручну перевірте меню, форму, кошик і оплату, якщо вони є. Швидка поява тексту не означає, що всі кнопки вже працюють.
Що означають три показники, які вам покажуть
| Показник | Що це людською | Добре, якщо |
|---|---|---|
| LCP | Коли з’явився найбільший видимий блок тексту або зображення в першому екрані. | не більше 2,5 секунди |
| INP | Затримка від взаємодії до наступного відображення результату: наприклад після кліку або введення. | не більше 200 мілісекунд |
| CLS | Оцінка неочікуваних зсувів вмісту, зокрема після завантаження сторінки. Це не секунди. | не більше 0,1 |
Це Core Web Vitals. Пороги застосовують до 75-го процентиля відвідувань: у більшості відвідувачів значення має бути не гіршим за вказане. Джерело: Google Web Vitals, перевірено 6 вересня 2026 року.
Чому у звіті немає даних або оцінки різняться
Дані реальних відвідувачів у PageSpeed Insights надходять із Chrome UX Report за останні 28 днів. Якщо відвідувань недостатньо, сервіс може показати дані всього домену замість сторінки або повідомити, що даних немає. Це не помилка сайту й не підтвердження хорошої швидкості.
Лабораторний тест — окреме завантаження в заданих умовах. Звичайний тест завантаження не вимірює INP: для нього потрібні взаємодії. Дивіться INP у польових даних, а для діагностики відтворюйте проблемні кліки. Після виправлень лабораторний результат змінюється одразу, польові дані оновлюються поступово.
Приклад оптимізації одного проєкту
Як читати цей приклад
Це внутрішні заміри одного з наших проєктів: Lighthouse 12.8.2, мобільний профіль, локальна production-збірка. У збережених звітах від 3 вересня 2026 року є початкові 79 і наступні 92 бали, а також результати вище 92. Це історія окремих прогонів, не середнє трьох тестів і не поточний результат публічного сайту.
Розміри шрифтів округлено за переданими байтами зі звітів до й після їх скорочення. Між прогонами змінювалися й інші частини сторінки, тому не можна приписати весь приріст лише шрифтам. Домен проєкту не розкриваємо; зростання заявок цим прикладом не виміряне.
Шрифти: зайві файли й символи
У темі можуть бути шрифти й накреслення, потрібні лише окремим елементам. Перевірте, які файли браузер справді запитує та які з них потрібні першому екрану. Їхній вплив залежить від способу підключення й відображення тексту.
На одному з наших проєктів шрифт Graphik підключався заради прихованого підпису кнопки «нагору». Його прибрали, решту файлів скоротили до потрібного набору символів. У двох збережених звітах обсяг переданих шрифтів зменшився приблизно з 280 до 61 КБ. Після такого скорочення потрібно перевірити всі мови й символи, включно з новими текстами.
Зовнішній сервіс теж може мати засоби оптимізації. Наприклад, Google Fonts дозволяє вибрати накреслення, діапазони й задати набір символів через text=. Для змінного тексту такий набір потрібно підтримувати. Можливість змінювати або розміщувати файл у себе залежить від ліцензії та налаштувань платформи.
Зображення: розмір, формат і момент завантаження
Наприклад, фотографію з телефона завантажили завширшки 4000 пікселів, а показують у картці завширшки 400. Якщо сайт віддає початковий файл, відвідувач завантажує зайві дані.
Підберіть кілька розмірів через srcset і sizes з урахуванням щільності екрана: для блоку завширшки 400 CSS-пікселів на екрані 2× може знадобитися зображення завширшки 800 пікселів. Порівняйте WebP або AVIF з початковим форматом за розміром і якістю, без очікування фіксованого відсотка економії.
Зображення нижче першого екрана можна завантажувати відкладено. Зображення LCP відкладати не варто: це затримає головний вміст. Задайте розміри, щоб під час завантаження не стрибала верстка. Для фонового відео підготуйте постер і окремо налаштуйте момент завантаження самого ролика: один постер не зупиняє завантаження відео.
Код теми, який ви не писали
Тема може завантажувати стилі й скрипти для галерей, магазину та інших компонентів, яких немає на вашій сторінці. Спочатку перевірте мережевий звіт і використовуваний код. Вимкнення модуля не завжди означає, що він зник із загального файлу теми.
На тому ж проєкті ми видаляли невикористовувані правила CSS. Але перевірка лише першого екрана пропустить класи відкритого меню, помилок форми або мобільної версії. Після очищення потрібно пройти ці стани, щоб прискорення не зламало інтерфейс.
Очищення можна автоматизувати під час збірки. Після оновлення теми або додавання блоку повторіть перевірку вигляду: нові класи можуть потрапити під видалення, а непотрібні правила — повернутися.
Чужі скрипти на вашій сторінці
Чат, аналітика, карта, відгуки й рекламні пікселі додають мережеві запити та роботу браузеру. Відкрийте список реально завантажених ресурсів: він точніший за список плагінів у панелі керування.
Некритичні віджети можна завантажувати пізніше, якщо це допустимо для їхньої задачі. Після зміни перевірте відкриття чату, надсилання форми й події аналітики: запізніле підключення може втратити ранні дії. Час появи віджета та виграш у швидкості потрібно виміряти.
Проксі-сервіс теж може додавати скрипти. Наприклад, Cloudflare Web Analytics підтримує автоматичну вставку свого коду на проксовані сайти за відповідного налаштування. Перевірте панель сервісу й фактичні запити сторінки.
Сервер, який довго думає
Тривале очікування першого байта (TTFB) не доводить, що сервер щоразу збирає сторінку наново. Причиною бувають мережа, перенаправлення, відсутність кешу, робота застосунку або навантаження на сервер. Почніть із розбору очікування відповіді.
Кешування допомагає швидше віддавати готовий результат. Стиснення зменшує передаваний обсяг, а кеш браузера дозволяє повторно використовувати файли. CDN може скоротити шлях до відвідувача. Для кошика, особистого кабінету й персональних даних загальні правила кешування застосовувати не можна без перевірки.
Перед замовленням доопрацювання перевірте налаштування своєї CMS, конструктора й хостингу: потрібне кешування або оптимізація зображень можуть уже входити в тариф. Переїзд обговорюйте після діагностики, якщо причина справді в інфраструктурі й доступних налаштувань недостатньо.
Де прискорення впирається у стелю
Бал Lighthouse залежить від метрик і умов тесту. У нашому прикладі 92 — результат одного прогону, а не межа React чи іншого фреймворка. Розмір JavaScript сам по собі не визначає, скільки балів отримає сторінка.
Блокування JavaScript корисне як діагностичний експеримент, але воно може вимкнути меню, форму й аналітику. Вищий бал без цих функцій не дорівнює прискоренню робочого сайту. Подальші правки оцінюйте за затримками та збереженням потрібних дій.
Конструктор, сторонній платіжний модуль і обов’язкові віджети обмежують доступні зміни. Тому конкретний результат обговорюють після заміру. Core Web Vitals беруть участь у ранжуванні Google, але хороші показники не гарантують високих позицій: значення мають і зміст сторінки, й інші чинники.
Що зазвичай питають про швидкість сайту
- Яка швидкість завантаження сайту вважається нормальною?
Для Core Web Vitals орієнтири такі: LCP не більше 2,5 секунди, INP не більше 200 мс, CLS не більше 0,1. Їх оцінюють за 75-м процентилем відвідувань. Єдиного часу «повного завантаження», який описує зручність будь-якого сайту, немає.
- Як перевірити швидкість свого сайту?
Відкрийте pagespeed.web.dev, введіть адресу потрібної сторінки й порівняйте мобільний і настільний профілі. Розрізняйте дані реальних відвідувачів і лабораторний тест. Збережіть кілька прогонів та рекомендації, щоб після правок повторити перевірку в тих самих умовах.
- Це мій сайт повільний чи мій інтернет?
Порівняйте сайт на іншому пристрої та в іншій мережі, потім відкрийте кілька інших сайтів. PageSpeed Insights перевіряє сторінку незалежно від вашого домашнього з’єднання, але його лабораторний профіль не відтворює всіх відвідувачів. Хороший результат одного тесту не виключає проблеми на конкретному пристрої.
- Чому на комп’ютері швидко, а на телефоні повільно?
Телефон може мати менше ресурсів, а з’єднання — більшу затримку. Крім того, мобільна версія іноді завантажує інший вміст. Порівняйте обидва профілі PageSpeed Insights і дані своєї аудиторії; сама мобільна індексація Google не робить настільний тест непотрібним.
- Чи підніме швидкість мій сайт у Google?
Прискорення може допомогти зручності й пошуковим показникам, але не гарантує зростання позицій. Google враховує Core Web Vitals разом з іншими чинниками. Бал Lighthouse не дорівнює позиції в пошуку.
- Скільки коштує прискорити сайт?
У нас разове прискорення коштує $600 для лендингу або сайту послуг до 30 сторінок і $1 200 для магазину, каталогу або кількох мовних версій. Замір перед роботою безкоштовний. Склад і обмеження узгодимо до оплати.
- Що робити, якщо сайт не просто повільний, а взагалі не відкривається?
Перевірте доступ з іншої мережі, статус домену й хостингу, DNS і сертифікат HTTPS. Якщо сайт недоступний усім, передайте повідомлення про помилку адміністратору або хостеру: причина може бути й у застосунку. Спочатку відновіть доступність, потім перевіряйте швидкість.
Заміряли — і цифра не сподобалася
Почніть зі звіту: довго чекаєте перший байт — розбирайтеся з відповіддю сервера; пізно з’являється велике фото — з його завантаженням; кнопки зависають — з роботою JavaScript. Збережіть початковий замір, внесіть одну групу змін і порівняйте результат у тих самих умовах.
Якщо потрібна допомога, у нас це разова робота: $600 і 2 тижні для лендингу або сайту послуг до 30 сторінок; $1 200 і 3 тижні для магазину, каталогу або кількох мовних версій. У звіті порівнюємо ті самі сторінки до й після та описуємо обмеження.
Перейдіть на сторінку прискорення й натисніть «Отримати безкоштовний розбір». Для початку підготуйте адресу сайту, проблемну сторінку й опис затримки. Замір безкоштовний: до оплати обговоримо, що можна виправити та чи є сенс замовляти роботу.
Потрібна допомога зі швидкістю сайту?
Почніть із безкоштовного розбору на 30 хвилин: подивимося, що заважає сайту, і скажемо, чи є що прискорювати.
Перейти до розбору швидкості