[Перевод] HTML & CSS Features, Tips For a 10x Faster Page Loading Speed — DEV Community
HTML и CSS фичи, советы для 10-кратного ускорения загрузки страниц
Мы все терпеть не можем, когда наша страница загружается так медленно!
Фактически, коэффициент конверсии сайта падает в среднем на 4,42% с увеличением времени загрузки на каждую секунду (от 0 до 5 секунд). Первые пять секунд времени загрузки страницы оказывают наибольшее влияние на коэффициент конверсии. (Portent, 2019)
Но вы можете увеличить скорость загрузки страниц вашего сайта, внеся изменения в ваши HTML и CSS файлы, не прибегая к услугам ведущих хостинговых служб!
(В этой статье мы будем рассматривать ускорение работы страницы только с помощью файлов HTML и CSS).
1. Ленивая загрузка
Ленивая загрузка — это стратегия сокращения длины критического пути рендеринга, что приводит к сокращению времени загрузки страницы.
a) Разделение CSS-файла
CSS должен быть тонким, доставляться как можно быстрее, а для разблокировки рендеринга рекомендуется использовать медиатипы и запросы. Что я имею в виду под «тонким»? Разделите ваш CSS-файл так, чтобы CSS полностью не выполнялся подряд на всех экранах.
