Помилка підключення. Спробуйте ще раз.

Перейти до вмісту
SEO Tools
Довідка та документація
Швидкість Високий вплив Середнє 30–60 хв

Блокуючі ресурси (render-blocking)

CSS та JS у заголовку, що гальмують перший рендеринг.

Що це

Render-blocking ресурси — це файли (зазвичай CSS та синхронний JS у <head>), які браузер повинен завантажити й обробити раніше, ніж відобразить контент. До того часу користувач бачить порожнечу.

Чому це важливо

Вони — найчастіша причина повільного першого рендерингу та поганого LCP. Чим їх більше й чим вони більші, тим довше триває, поки з'явиться контент.

Як це зробити

  1. 1Скрипти відкладіть через defer/async.
  2. 2Визначте «critical CSS» (стилі для видимої частини) та вставте їх inline, решту завантажуйте асинхронно.
  3. 3Об'єднайте та мініфікуйте файли CSS/JS, видаліть невикористовувані стилі.
  4. 4Зовнішні шрифти завантажуйте з font-display: swap і попередньо завантажуйте їх.

Висновок

Мета — доставити видимий контент якомога раніше, а все інше відкласти. Почніть із відкладання скриптів (швидка перемога) та оптимізації CSS (critical CSS). Ця сфера має прямий вплив на LCP — метрику, яку Google відстежує.

Повʼязані теми