Почему страница медленная
page-speedPROскоростьоптимизация
Сначала меряет, потом чинит — и в том порядке, в котором это вообще имеет смысл.
Что делает
- Срабатывает на «сайт тормозит», «низкий балл», «проверь скорость».
- Запрещает трогать что-либо до замера: догадки о том, что тормозит, обычно неверны, а оптимизация не того стоит дня и не двигает ничего.
- Меряет на медленном устройстве и медленной сети: замер на быстрой машине по проводу ничего не говорит о телефоне, с которого и заходят.
- Читает три числа и знает, кого винит каждое: самая крупная отрисовка — картинку или шрифт, сдвиг вёрстки — опоздавший элемент без размеров, задержка отклика — почти всегда JavaScript.
- Чинит по порядку: не отправлять, отправить меньше, отправить позже, отправить раньше. И запрещает откладывать загрузку главной картинки — от этого число становится хуже.
- Требует назвать число до, число после и устройство, на котором мерили. Процент без основания не значит ничего.
- Возвращает назад правку, которая не сдвинула число: сложность, купленная зря, оплачивается следующим читателем кода.
Зачем он нужен
Скорость чинят по советам из статей — и получают неделю работы без изменений в числах. Порядок здесь важнее приёмов: самый быстрый ресурс тот, который не запросили, и удаление лишней библиотеки почти всегда даёт больше, чем любая настройка сжатия. А главная ошибка — откладывать загрузку той самой картинки, по которой и считается результат.
Куда положить
- 1Создайте в проекте папку .claude/skills/page-speed
- 2Положите в неё файл SKILL.md с текстом ниже
- 3Всё. Claude Code подключит скил сам, когда задача подойдёт под описание
Чтобы скил работал во всех проектах, а не в одном, положите его в ~/.claude/skills вместо папки проекта.
Файл SKILL.md
# Making a page fast
Measure before changing anything. Most guesses about what is slow are
wrong, and optimising the wrong thing costs a day and moves nothing.
## Measure the right thing
Field data beats lab data. A Lighthouse run on a fast machine over
fibre says little about a mid-range phone on mobile data, which is what
most visitors are on. If there is no field data, throttle: mid-tier CPU,
slow 4G.
Look at three numbers and know what each blames:
- **Largest paint** — the biggest thing above the fold. Usually an
image, a webfont, or content waiting on a request.
- **Layout shift** — something arrived late and pushed the page around.
Almost always an image without dimensions, a late-loading font, or an
injected banner.
- **Interaction delay** — the main thread is busy. Almost always
JavaScript.
## Fix in this order
Файл скила входит в PRO-подборку
Открыть доступ