Всё, что замедляет работу сайта должно быть исправлено. Чтобы провести корректные настройки страницы, и она загружалась практически мгновенно, требуется провести глубокий аудит. Поверхностные решения редко приносят пользу. Наша команда проводит аналитику на основании нескольких тестов, которые позволяют видеть картину в целом. После их детального анализа разрабатывается поведенческая стратегия, которая индивидуальна для каждого сайта. Только после этого можно приступать к пошаговой оптимизации. В результате её проведения, не только улучшается скорость загрузки страницы, но и исчезают ошибки. К таким сайтам поисковые системы лояльны. А это важно как при платном, так и при бесплатном продвижении.
Одним из эффективных инструментов тестирования, который позволяет определить скорость сайтов, является PageSpeed Insights. Это инструмент от Google и на основании его показателей, поисковая система решает нравится ей страница, или нет. Чем больше претензий, тем хуже сайт по мнению поисковика. Помимо оценки, сервис выдаёт рекомендации, исправление которых позволит улучшить характеристики. В перечне проведённых аудитов можно найти пункт: «Время выполнения кода JavaScript». Рядом с ним всегда отображается время, которое требуется для выполнения команды.
Как измерить время выполнения JavaScript
Можно произвести замеры не в миллисекундах, а в микросекундах. Это даст более точное понимание. Эффективно настроить метки пользовательского времени, чтобы выявить на каких этапах и почему его затрачивается больше. Для этого стоит воспользоваться инструментом User Timing API. Подробнее нём и его работе вы можете прочитать в нашей статье.
Как проводится проверка на время выполнения кода JavaScript в PageSpeed Insights
Для проведения аудита у сервиса есть не более 3,5 секунд. Это критичное время, которое основано на аналитике пользовательской активности в сети интернет. Дольше люди просто не ждут, загрузится страница, или нет. Они с неё просто уходят. Соответственно, система тоже не намерена ждать, считая это не целесообразным.
Анализатор имитирует загрузку страницы из произвольной географической точки. В случае с PageSpeed Insights, выбирается ближайший сервер от места загрузки. Для того, чтобы веб-разработчик или владелец сайта мог определить наиболее значимые факторы, которые оказывают воздействие на затрачиваемое время, информация выводится в виде детализированной таблицы. Lighthouse показывает сколько конкретно миллисекунд потребовалось на выполнение, оценку и анализ каждого файла JavaScript, который загружается страницей.
Если на загрузку JS требуется более 2 секунд, Маяк выдаёт предупреждение, отмечая время красным. Буквально оно значит — это непорядок и надо срочно что-то далать, чтобы исправить ситуацию. Если JavaScript не загрузился за 3,5 секунд — аудит считается не удавшимся. Работать со столь медленной страницей сервис отказывается.
Причины длительной загрузки JavaScript
- Вес сетевой нагрузки. Чем больше байтов требуется обработать, тем дольше происходит загрузка.
- Необходимость обработать и скомпилировать элементы. JavaScript анализируется и компилируется в основном потоке. Когда основной поток занят, страница не может реагировать на действия пользователя.
- Время выполнения. Процесс выполнения JavaScript также происходит в основном потоке. Следовательно, если код обширный, не все его элементы требуются пользователю здесь и сейчас. Часть из них будет необходима позже. Но, все они влияют на время взаимодействия со страницей. Из-за этого у юзера появляется ощущение, что страница «тормозит».
- Перегруженная память. JavaScript может содержать всевозможные ссылки. И чем их больше, тем сильнее они засоряют память. От этого страницы могут выглядеть громоздкими и медленными. Это может стать причиной полного зависания страницы.
Причины по которым JavaScript может загружаться дольше, чем того хотелось бы — выявлены. И их требует устранить.
Как сократить время выполнения JavaScript
Существует целый ряд рекомендаций, как сократить время выполнения JavaScript. Первая и главная — его следует прописывать внизу страницы. И вот почему. Выполнение скриптов происходит именно в той последовательности, в которой они прописаны. Как только синтаксический анализатор встретит в дереве DOM код JavaScript, он приостановит выполнение DOM и займётся им. При этом, у системы не будет полного набора компонентов, которые требуются для выполнения задачи. Соответственно — выполнить задачу невозможно, пока всё не будет проанализировано и обработано. Только после завершения работы над JavaScript, механизм вернётся к созданию модели DOM. И на это может уйти много времени.
Также в списке рекомендаций:
- Отправляйте коды JavaScript исключительно методом их разделения
- Оптимизируйте код JavaScript. Уменьшите и сожмите его
- Удалите все неиспользуемые коды
- Используйте кэширование
Эти простые рекомендации, выполненные правильно, позволят увеличить скорость загрузки страницы, а значит — лояльность пользователей к сайту.