Сравните сайт до и после правок Claude Code в одинаковых условиях, затем найдите действие, на котором появилась задержка. Причину удобнее искать по цепочке: загрузка страницы, появление главного содержимого, реакция на нажатие, запрос к серверу. Такой порядок помогает отделить тяжёлое изображение от лишнего JavaScript или медленного ответа сервера. Ниже разберём, что проверить в браузере, какие данные передать Claude Code и как убедиться, что исправление сохранило нужные функции сайта.
Как убедиться, что сайт замедлился именно после правок?
Откройте одну и ту же страницу в прежней и новой версии сайта. Для проверки используйте отдельную тестовую копию, если она есть. Не возвращайте рабочий сайт к старому состоянию только ради сравнения: сначала пригодится план отката перед публикацией правок Claude Code.
Выберите конкретный сценарий посетителя: открыть карточку товара, раскрыть меню или отправить форму с тестовыми значениями. Фраза «сайт стал тормозить» слишком расплывчата для диагностики. Наблюдение «после нажатия на категорию страница перестаёт реагировать» уже задаёт участок поиска.
- Запишите страницу и действие, после которого заметна задержка.
- Откройте прежнюю и новую версии в одном браузере на одном устройстве.
- Повторите сценарий с одинаковыми настройками сети и кеша.
- Сохраните результаты замеров и снимок экрана с задержкой.
Кеш хранит файлы сайта в браузере, поэтому повторное открытие страницы отличается от первого визита. Проверяйте эти режимы отдельно. Если старую версию вы открыли с готовым кешем, а новую впервые, сравнение не покажет вклад правок.
Закройте лишние вкладки и по возможности исключите расширения браузера из проверки. Если задержка возникает только на одном устройстве, зафиксируйте это условие. Claude Code нужен воспроизводимый сценарий, иначе он начнёт исправлять код по предположению.
Как определить, что тормозит: загрузка, нажатия или сервер?
В инструментах разработчика браузера начните с вкладки Network. Она показывает запросы страницы: изображения, скрипты, стили и обращения к серверу. Затем запишите проблемное действие во вкладке Performance, чтобы увидеть, чем браузер занят во время задержки. Названия и расположение элементов зависят от версии браузера.
Для первичной диагностики полезно различать несколько симптомов. Каждый из них направляет поиск, но сам по себе ещё не доказывает причину.
- Главное изображение или крупный текст появляются поздно. Проверьте загрузку этого элемента и работу, которая предшествует его появлению. С этим связан LCP, показатель появления крупнейшего видимого элемента содержимого.
- Меню или кнопка отвечают с задержкой. Запишите взаимодействие и ищите длительную работу JavaScript. INP описывает задержку реакции страницы на взаимодействия пользователя.
- Текст и кнопки сдвигаются после открытия страницы. Посмотрите, какой блок появляется без заранее выделенного места. CLS отражает неожиданные сдвиги макета.
- После нажатия долго не приходит результат. Найдите соответствующий запрос в Network и проверьте, где уходит время: на ожидание ответа или получение данных.
Для условного каталога товаров причина может находиться в новом фильтре: он отправляет запрос при каждом изменении поля либо повторно обрабатывает весь список. Это гипотезы для проверки. Подтверждением станет запись запросов или работы браузера, где задержка совпадает с действием фильтра.
Один запуск теста не даёт устойчивой картины. Повторите замер в тех же условиях и посмотрите, воспроизводится ли проблема. Лабораторная проверка помогает найти участок кода, но не заменяет наблюдение за работой сайта у посетителей. По одному отчёту также нельзя делать вывод об изменении позиций в поиске или числа заявок.
Как поставить Claude Code задачу на поиск причины?
Передайте агенту симптом, условия проверки и список последних изменений. Попросите сначала изучить код и предложить проверяемую гипотезу. Если сразу написать «ускорь весь сайт», агент получит слишком широкую задачу и может затронуть функции, которые работали без задержек.
Текст задачи можно составить так: «После изменения фильтра каталог реагирует на выбор категории с задержкой. В прежней версии задержка не воспроизводится. Изучи различия между версиями и найди код, который выполняется при выборе категории. Сначала опиши гипотезу и способ её проверки. Не меняй зависимости и соседние функции без объяснения причины».
Добавьте к задаче материалы из браузера. Если передаёте запись запросов или снимки экрана, уберите из них секретные ключи и служебные значения. Для поиска причины обычно достаточно пути запроса, времени его выполнения и участка кода, который его вызывает.
- Укажите версию, в которой задержки ещё не было.
- Опишите точную последовательность действий до задержки.
- Приложите результаты Network или Performance для этого сценария.
- Обозначьте функции, которые исправление обязано сохранить.
Постоянные правила проекта удобно записывать в AGENTS.md. В исходном материале о harness этот файл описан как инструкция для агентов: как собрать проект, запустить тесты и соблюдать соглашения (журнал Яндекс Практикума «Код», «Harness для ИИ-агента: что это и как собрать свой на Python»). Для диагностики скорости туда можно добавить команды проверок и требование сравнивать поведение до и после правки.
Разовый симптом оставьте в текущей задаче. В AGENTS.md лучше хранить правило, которое пригодится при следующем изменении: например, проверять открытие каталога и работу фильтра после правок его компонентов.
Как проверить исправление и сохранить работающие функции?
Попросите Claude Code исправлять подтверждённую причину отдельной правкой. Если одновременно заменить изображения, переписать фильтр и обновить зависимости, выяснить источник улучшения будет трудно. Ограниченное изменение проще проверить и при необходимости отменить.
Сначала повторите исходный сценарий с теми же настройками браузера. Затем проверьте соседнее действие: если исправляли выбор категории, сбросьте фильтр и откройте карточку товара. Ускорение не считается готовым результатом, если каталог перестал показывать часть позиций.
- Повторите замер, на котором была видна задержка.
- Сравните результаты с прежней записью в одинаковых условиях.
- Проверьте основной сценарий и соседнюю функцию.
- Просмотрите изменения в коде перед публикацией.
Отдельно проверьте внешний вид страницы. Например, место под изображение помогает избежать сдвига содержимого, но после изменения размеров текст или кнопка могут выйти за границы блока. Для повторяемой проверки экранов пригодится проверка вёрстки после правок Claude Code в Playwright.
Playwright помогает повторять действия и проверять результат, однако успешный функциональный тест сам по себе не подтверждает скорость сайта. Для этого сохраните отдельные замеры. В отчёте об исправлении должны быть видны исходный симптом, причина, изменение и результат повторной проверки.
Если проблему передают разработчику на диагностику, такой набор материалов задаёт понятный объём работы. Результат можно принять по воспроизводимому сценарию и сравнению замеров, без обещаний «сделать сайт быстрее» вообще.
Типичные ошибки при поиске замедления
- Исправлять всё сразу. Сначала проверьте одну гипотезу, затем внесите отдельную правку и повторите замер.
- Сравнивать разные страницы или устройства. Выберите одинаковый сценарий и сохраните условия проверки.
- Оценивать скорость только по итоговому баллу отчёта. Найдите конкретную задержку, запрос или участок работы браузера.
- Считать предположение Claude Code доказательством. Попросите показать связь между кодом, наблюдаемым симптомом и результатом проверки.
- Удалять нужную функцию ради улучшения показателя. Заранее запишите, какое поведение сайта должно сохраниться после исправления.
Начните с действия на минуту: откройте страницу, где заметна задержка, и запишите одну строку по шаблону «страница — действие — что происходит вместо ожидаемого результата».
