Render-blocking элементы приостанавливают загрузку страницы до того момента, пока не будет загружен какой-то внешний ресурс. Например, загрузка CSS:
<link rel="stylesheet" href="/styles.css" />
Когда браузер встретит эту инструкцию, он приостановит показ страницы, и будет ждать окончания загрузки файлы styles.css. Все это время посетитель будет видеть белую страницу.
Если человек впервые попадает на Ваш сайта это может быть проблемой. Вместо того, чтобы загрузить и показать HTML, браузер вынужден сделать несколько дополнительных запросов перед тем, как показать посетителю результат.
На страницах приземления от внешних стилей лучше избавляться. Вместо них лучше использовать встроенные стили, которые будут содержать только используемые на странице селекторы:
<html> <head> <title>[Хд] Как делать быстрые и большие сайты</title> <link rel="stylesheet" href="/styles.css" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <style> body { margin: 0 } h1 { color: #444; } * и другие стили используемые на этой странице </style> </head> </body> ... Страница приземления ... </body> </html>
Убираем внешнюю загрузку CSS и используем встроенные стили
CSS Extractor позволит вырезать нужные стили. Для этого достаточно просто указать URL страницы и инструмент покажет набор стилей, которые используются только для нее.
После этого Вы просто вставляете показанные стили в тег style и обеспечиваете более эффективную работу сайта для новых посетителей.
Этот текст был написан несколько лет назад. С тех пор упомянутые здесь инструменты и софт могли получить обновления. Пожалуйста, проверяйте их актуальность.
Сегодня мы поговорим о том, как выбрать лучшие курсы Power BI в Украине, особенно для…
В 2023 году во всех крупнейших регионах конкуренция за вакансию выросла на 5–12%. Не исключением…
Unicorn Hunter/Talent Manager Лина Калиш создала бесплатный трекер поиска работы в Notion, систематизирующий все этапы…
Edtech-стартап Mate academy принял решение отправить своих работников в десятидневный отпуск – с 25 декабря…
Служба безопасности Украины задержала в Киеве 46-летнего программиста, который за деньги устанавливал шпионские программы и…
IT-специалист Джордан Катлер создал и выложил на Github подборку разнообразных ресурсов, которые помогут достичь уровня…