Откуда берётся проблема
Со временем на странице скапливаются скрипты, которые подключил не разработчик, а маркетолог или менеджер: счётчики, системы аналитики, онлайн-чаты, обратный звонок, карты, виджеты отзывов, рекламные пиксели. Каждый такой скрипт — это дополнительный запрос к чужому серверу, чужой код в основном потоке страницы и потенциальный источник смещений макета.
Как провести аудит
- Откройте вкладку сети в инструментах разработчика и отфильтруйте запросы к чужим доменам.
- Составьте список: что это за скрипт, кто его подключил, зачем он нужен.
- Замерьте вес и время выполнения каждого, отметьте самые тяжёлые.
- Проверьте, какие из них работают на всех страницах, а какие нужны только на некоторых.
- Для каждого решите: убрать, отложить или оставить как есть.
Что делать с разными типами скриптов
| Тип скрипта | Основной риск | Способ снизить вред |
|---|---|---|
| Счётчики и аналитика | Запросы и вычисления на каждой странице | Подключать асинхронно, не дублировать несколько систем с одной задачей |
| Онлайн-чат | Тяжёлый код, который нужен не каждому | Загружать после первого взаимодействия или через облегчённую заглушку |
| Карты и видео | Большие вложенные окна | Показывать картинку-заглушку, загружать при нажатии |
| Реклама | Смещения макета и лишние запросы | Резервировать место под блок заранее |
| Виджеты отзывов и соцсетей | Чужие шрифты, стили и скрипты | Заменить лёгкой статичной версией |
Как подключать
Скрипт, не влияющий на первый экран, не должен блокировать разбор страницы. Для этого используют атрибуты defer или async, а для вложенных окон — отложенную загрузку:
<script src='/js/widget.js' defer></script>
<iframe src='https://example.ru/map/' loading='lazy'
width='600' height='400' title='Карта'></iframe>
Размеры окна задаются заранее, чтобы при загрузке не сдвигалось содержимое: о таких сдвигах — в статье про CLS.
Когда проще отказаться
- Скрипт подключён давно, а вопрос «кто им пользуется?» остаётся без ответа.
- Две системы собирают одни и те же данные.
- Функция используется редко, а вес скрипта — заметный.
Связь с отзывчивостью. Чужой код занимает основной поток и ухудшает показатель INP. А если робот не может выполнить скрипт, от него может зависеть и попадание контента в индекс: об этом — в статье про индексацию страниц, созданных JavaScript.
Частые вопросы
Почему сторонние скрипты так сильно замедляют страницу?
Каждый из них добавляет запросы к чужим серверам и выполняется в основном потоке, где конкурирует с вашим кодом за время процессора.
Чем отличаются атрибуты defer и async?
Оба не блокируют разбор страницы; defer выполняет скрипт после разбора документа в порядке подключения, async — как только скрипт загрузился, независимо от порядка.
Как понять, какие скрипты убрать?
Составить список всех скриптов с чужих доменов, определить, кто и зачем их использует, и убрать те, у которых нет владельца или ощутимой пользы.
Готовый адрес можно собрать прямо сейчас: откройте генератор ЧПУ — он транслитерирует фразу по таблице Яндекса, уберёт служебные слова и покажет длину адреса.