Початкові таблиці стилів перевищують бюджет передавання

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

Таблиці стилів можуть затримати перший рендеринг у браузері, поки він читає правила, потрібні для відображення сторінки. Зменшення зайвого CSS може допомогти, але сам обсяг передавання не встановлює, які правила критичні чи як швидко відвідувачі бачать сторінку.

Що зробити

Прочитайте зафіксовану сторінку, адреси таблиць стилів, закодовані розміри передавання й бюджет. Відсутнє чи неповне джерело зазначається окремо; воно не вважається доказом повної сторінки.
Видаліть невикористані правила й зайві посилання на таблиці стилів і розгляньте поділ CSS за шаблонами сторінок. Залиште стилі, потрібні сторінці.
Де доречно, використовуйте стиснення й порівняйте результат у браузері. Вбудовуйте лише відповідно невелику критичну частину, коли ви встановили, що потрібно сторінці; ця перевірка такого висновку не робить.

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

Що ми читаємо

Ми використовуємо початковий head HTML сторінки та її базову адресу, щоб визначити прямі посилання на таблиці стилів, які підтверджено застосовуються до медіа screen на початку сторінки. Вимкнені, неактивні посилання, посилання лише в body та лише для друку не встановлюють блокувального передавання. Нерозв’язані медіаумови, іменовані набори таблиць стилів і непевне розміщення в head залишають охоплення неповним.

Для кожної підтвердженої запитаної адреси ми рахуємо закодовані байти тіла відповіді, фактично виміряні нашим засобом зчитування. Content-Length і розмір декодованого CSS їх не замінюють. Повторні посилання на одну зафіксовану запитану адресу враховуються один раз; окремі фіксації за різними запитаними адресами враховуються окремо, навіть коли вони ведуть до тієї самої кінцевої адреси.

Імпортовані дочірні таблиці стилів не входять до цього бюджету прямих посилань. Неповне передавання може встановити додатну нижню межу, коли байти вже перевищують бюджет, але не може встановити, що попередню проблему виправлено. Бюджет береться із зафіксованих налаштувань аудиту; старіший аудит без нього лишається неперевіреним.

Приклад і докази

Ілюстративний приклад — схематичні зафіксовані лічильники, а не реальний аудит.

Сторінка за адресою https://bakery.example/ підключає в початковому head дві таблиці стилів для медіа screen. Зафіксований бюджет — 102 400 байтів.

/assets/base.css: 61440 encoded bytes
/assets/page.css: 40961 encoded bytes
Total: 102401 bytes
Recorded budget: 102400 bytes

Виміряний загальний обсяг перевищує бюджет на один байт. Якщо новий повний аудит прочитає ту саму сторінку й виміряє 61440 + 40960 = 102400 байтів, загальний обсяг більше не перевищуватиме бюджету. Неповне передавання чи непридатна до читання сторінка не можуть підтвердити це виправлення.

Підтвердити й перевірити знову

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

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

Обмеження та джерела

Ми не рендеримо сторінку, не визначаємо критичного CSS і не вимірюємо каскаду завантаження в браузері, першого відображення чи Largest Contentful Paint. Обмеження роботи, недоступні джерела й нерозв’язані умови залишають охоплення неповним. Виміряний обсяг передавання описує наші запити, а не мережу чи кеш кожного можливого відвідувача.

Упевненість: Висока Порівняння використовує зафіксовані лічильники й зафіксований бюджет; його вплив на завантаження для відвідувача не вимірюється.

Джерела

web.dev, Оптимізація Largest Contentful Paint — Пояснює, як ресурси, що блокують рендеринг, можуть затримувати відображення, і розглядає скорочення невикористаних стилів та часу завантаження ресурсів. Бюджет продукту в 100 KiB не є обмеженням, визначеним цим посібником. Перевірено 10 жовтня 2026.

Редакційна перевірка: 15 жовтня 2026