На Вашем сайте есть медленные скрипты? Google Chrome будет с этим бороться
Каждый пользователь периодично сталкивается с проблемой медленного интернета. Это, в первую очередь, негативно влияет на загрузку просматриваемых страниц. Например, когда загрузка обрывается, чтобы прогрузить какой-то тяжелый блок на сайте. В большинстве случаев такая проблема возникает из-за неправильного встраивания элементов с помощью JavaScript. Разработчики Google Chrome уже давно обратили внимание на данный вопрос и решили действовать совсем радикально.
Суть проблемы. Это, конечно же, дело в скорости загрузки страниц и особенностях работы браузеров. Перед процессом отображения страницы сайта браузер полностью её анализирует и составляет DOM-дерево. Если в коде попадается скрипт, браузер ждет, пока тот закончит свою работу, чтобы продолжить анализ HTML-разметки.
Суть процесса: когда один скрипт встраивает на страницу другой скрипт, это влечет цепную реакцию — браузер обязан ждать, пока следующий скрипт скачается и выполнит свою работу.
По исследованиям Google, то это довольно серьезная проблема. Для пользователей, у которых медленное интернет-соединение, ожидания загрузки сайта может достигать несколько десятков секунд. И в итоге подобные сайты либо закрывают из-за невозможности ожидания, или сайт так и не открывается из-за технических неполадок, по которым загрузка все-таки обрывается. Рекомендуем статью "8 советов, которые помогут ускорить работу Вашего сайта".
Блокировка подобных скриптов имеет ряд преимуществ для пользователей с медленным интернетом. Так Google приводит подробную статистику после отключения подобных скриптов на сайтах:
- на 10% больше загрузок достигают «first contentful paint», тоесть присутствует визуальное подтверждения загрузки страницы;
- на 25% больше загрузок стали достигать полного отображения контента сайта;
- количество перезагрузок страниц упало на 10%, что дает возможность сделать вывод о удовлетворенности пользователей результатами от загрузки сайта;
- на 21% (это более чем на секунду) уменьшилось время загрузки до «first contentful paint»;
- на 38% уменьшилось время обработки страницы (в среднем 6 с), что наверное является наиболее существенным и значимым показателем для посетителя сайта.
Много веб-специалистов задаются вопросом: часто ли встречается встраивание скриптов на сайте. Ответ Google: в 7,6% пользователей, которые имеют дело с медленным интернет-соединением. Как видим, процент довольно не маленький, поэтому данный вопрос существенный.
Что предпринято для борьбы с медленными скриптами? Прежде всего будет происходить блокировка скриптов встроенных с помощью document.write. Но для того, чтобы это условие происходило, необходимо сочетание нескольких следующих моментов. Рассмотрим их далее:
- Пользователь имеет низкую скорость соединения.
- Вызов document.write() происходит из основного документа.
- Скрипт, который вызывается с помощью document.write, на самом деле препятствует загрузке страницы. Скрипты, которые имеют атрибуты async и defer блокироваться не будут.
- Скрипт, который вызывается, не закеширован бразуером. Если скрипт закеширован, то он не будет значительно влиять на скорость загрузки сайта.
- Обращение к странице - это не перезагрузка.
Использование CDN для Вашего сайта - еще один метод ускорения загрузки вашего сайта.
Если Вам необходимо, чтобы все ваши скрипты загружались у пользователя, следуйте советам.
Наиболее правильным вариантом будет отказаться от использования document.write для совершения загрузок. Google имеет список сервисов, которые предлагают скрипты с асинхронной загрузкой (если Вы знаете сервисы, которых нет в данном списке, но которые имеют хорошую репутацию, добавляйте их к данному перечислению). В случае крайней необходимости использования сторонних скриптов с document.write, вы можете самостоятельно изменить их добавив атрибут async к элементу script, или заменить document.write на document.appendChild() или parentNode.insertBefore(), так же делают для Google Analytics.
Коснется ли данная проблема к моему сайту?
Изначально необходимо узнать, сколько пользователей Вашего ресурса используют 2G интернет. Это можно сделать используя Network Information API. Более точную и дополнительную информацию можно узнать на официальном сайте Google в соответствующем разделе.
Также для ускорения WordPress используйте наши практические советоы для вашего сайта.