От метрики к диффу: как лаборатория пишет рецепты

«LCP 4,2 секунды» — это симптом. Ни один разработчик не может взять его в работу: непонятно, что менять. Между цифрой и исправлением лежит работа, которую обычно делает опытный инженер: найти виновный ресурс, понять, почему он так грузится, и придумать, как это поменять, не сломав остальное.

Рецепт лаборатории проходит этот путь целиком.

Четыре шага

1. Симптом. Метрика, её значение и порог. LCP 4,2 с при норме 2,5 с.

2. Причина. Какой элемент стал LCP, какой ресурс его задерживает и почему. Здесь — hero-картинка, которую слайдер подставляет скриптом после загрузки 214 КБ JavaScript; сама картинка — JPEG на 1,8 МБ без размеров и без приоритета.

3. Рецепт. Что поменять и где. Первый слайд — статичной разметкой, картинка — в AVIF с srcset и fetchpriority="high", слайдер — после первого взаимодействия.

4. Эффект. Прогноз по данным замера: LCP 4,2 → 1,9 с.

Дифф, а не совет

Каждый рецепт заканчивается изменением кода:

- <div class="slider" data-src="/img/hero.jpg"></div>
+ <img src="/img/hero-1280.avif" width="1280" height="720"
+      fetchpriority="high" alt="Коллекция осень-2026">

Такое задание можно отдать разработчику на ревью или AI-агенту на исполнение. Формат совместим с Claude Code, Cursor и Copilot: лаборатория готовит контекст, агент вносит правку, CI-гейт проверяет, что прогноз сбылся.

Почему это работает

AI здесь не угадывает. Каждый шаг опирается на данные замера: трассировку загрузки, покрытие кода, структуру шаблонов. Модель связывает эти данные в объяснение и предлагает исправление — а протокол замера проверяет, что исправление сработало.