[{"data":1,"prerenderedAt":28},["ShallowReactive",2],{"$f7qgZ_1YmNjyeBHWEGppNRgjpp6CjIKpZbvX5mJvVm_0":3},{"slug":4,"title":5,"description":6,"date":7,"created_at":8,"updated_at":8,"h1":5,"content":9,"views":10,"next_articles":11},"render-blocking-i-http2","Render-blocking и HTTP\u002F2","Render-blocking CSS и JavaScript, defer, async, critical CSS и HTTP\u002F2: как улучшить первую отрисовку без подмены диагностики обещаниями скорости.","2026-08-08","2026-09-07","\u003Cp>HTTP\u002F2 позволяет эффективнее доставлять несколько файлов, но не отменяет порядок работы браузера. Пока критический CSS или синхронный JavaScript в head не обработан, пользователь может видеть пустой экран. Поэтому сначала найдите конкретные блокирующие ресурсы, а не включайте протокол как «ускоритель всего».\u003C\u002Fp>\n\u003Ctable>\u003Cthead>\u003Ctr>\u003Cth>Подход\u003C\u002Fth>\u003Cth>Когда уместен\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\u003Ctbody>\u003Ctr>\u003Ctd>defer\u003C\u002Ftd>\u003Ctd>Скрипты приложения, важен порядок\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>async\u003C\u002Ftd>\u003Ctd>Независимая аналитика\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>critical CSS\u003C\u002Ftd>\u003Ctd>Небольшие стили первого экрана\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>HTTP\u002F2\u003C\u002Ftd>\u003Ctd>Современная доставка ресурсов\u003C\u002Ftd>\u003C\u002Ftr>\u003C\u002Ftbody>\u003C\u002Ftable>\n\u003Cpre>\u003Ccode><link rel=\"stylesheet\" href=\"\u002Fassets\u002Fsite.css\">\n<script defer src=\"\u002Fassets\u002Fapp.js\"><\u002Fscript>\n<script async src=\"https:\u002F\u002Fanalytics.example\u002Ftag.js\"><\u002Fscript>\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Ccode>defer\u003C\u002Fcode> скачивает скрипт параллельно и выполняет его после разбора HTML в порядке подключения. \u003Ccode>async\u003C\u002Fcode> подходит только независимому коду: он может выполниться в любой момент. Не переносите критическую логику в async только ради оценки аудита.\u003C\u002Fp>\n\u003Cp>Короткий critical CSS полезен, если он действительно покрывает первый экран; копия всего stylesheet в HTML увеличит вес и усложнит кэширование. HTTP\u002F2 почти не является самостоятельным SEO-фактором: его ценность — в более удобной доставке файлов при нормальном сервере.\u003C\u002Fp>\n\u003Cp>Найдите источники в \u003Ca href=\"\u002Ftools\u002Frender-blocking\">проверке render-blocking\u003C\u002Fa>, проверьте протокол через \u003Ca href=\"\u002Ftools\u002Fhttp2\">HTTP\u002F2\u003C\u002Fa> и сравните изменения в \u003Ca href=\"\u002Fcheck\u002Ffree\">бесплатной проверке\u003C\u002Fa>.\u003C\u002Fp>\n\u003Csection class=\"blog-faq\">\u003Ch2>Вопросы и ответы\u003C\u002Fh2>\u003Cdetails>\u003Csummary>HTTP\u002F2 сам исправит белый экран?\u003C\u002Fsummary>\u003Cp>Нет. Он не делает тяжёлый синхронный JavaScript неблокирующим и не уменьшает CSS. Сначала посмотрите waterfall и покрытие ресурсов, затем уберите лишнее, назначьте defer или разделите код по страницам.\u003C\u002Fp>\u003C\u002Fdetails>\u003Cdetails>\u003Csummary>Всегда ли нужно ставить defer?\u003C\u002Fsummary>\u003Cp>Для обычных скриптов приложения defer часто безопасен, но проверьте порядок зависимостей и inline-код, который ждёт библиотеку раньше. Аналитику и независимые пиксели можно подключать async, если они не управляют интерфейсом.\u003C\u002Fp>\u003C\u002Fdetails>\u003Cdetails>\u003Csummary>Critical CSS обязателен?\u003C\u002Fsummary>\u003Cp>Нет. На маленьком сайте выигрыш может быть меньше, чем цена поддержки двух версий стилей. Сначала сожмите изображения, удалите неиспользуемые стили и сторонние виджеты, затем измерьте необходимость critical CSS.\u003C\u002Fp>\u003C\u002Fdetails>\u003Cdetails>\u003Csummary>HTTP\u002F3 нужно включать вместо HTTP\u002F2?\u003C\u002Fsummary>\u003Cp>HTTP\u002F3 может быть полезным дополнением, но не повод откладывать базовые исправления. Наличие протокола не заменяет быстрый серверный ответ, разумный вес страницы и отсутствие блокирующих ресурсов.\u003C\u002Fp>\u003C\u002Fdetails>\u003C\u002Fsection>",0,[12,16,19,22,25],{"slug":13,"title":14,"date":15,"views":10},"gzip-i-keshirovanie","Gzip и Brotli: сжатие HTML, CSS и JS","2026-08-09",{"slug":17,"title":18,"date":15,"views":10},"vebmastery-yandex-google","Вебмастеры Яндекса и Google: настройка",{"slug":20,"title":21,"date":7,"views":10},"bitye-css-i-js","Битые CSS и JS",{"slug":23,"title":24,"date":7,"views":10},"razmer-dom-seo","Размер DOM и SEO",{"slug":26,"title":27,"date":7,"views":10},"hsts-i-security-headers","HSTS и security headers",1789381425052]