AIKraft/AI/Войти
AIKraft/Skills/optimize

optimize

Диагностирует и устраняет узкие места производительности UI: загрузка, рендеринг, анимации, изображения и размер бандла. Применяйте при жалобах на медленную работу, лаги или для ускорения загрузки страниц.

pbakaus official Разработка ★ 76.2k

Что делает навык

Skill диагностирует и устраняет узкие места производительности UI, включая загрузку, рендеринг, анимации, изображения и размер бандла. Он помогает решать проблемы с медленной работой, лагами и длительной загрузкой страниц, применяя системный подход к оптимизации.

Когда применять

  • Жалобы пользователей на медленную загрузку страниц или лаги интерфейса.
  • Необходимость ускорения загрузки контента за счет оптимизации изображений и бандлов.
  • Улучшение показателей Core Web Vitals (LCP, INP, CLS) для повышения качества UX.
  • Оптимизация рендеринга и анимаций для обеспечения плавной работы на мобильных устройствах.

Как работает

  1. Измерить текущее состояние производительности с помощью инструментов (Chrome DevTools, Lighthouse, WebPageTest), оценив Core Web Vitals, время загрузки, размер бандла и использование ресурсов.
  2. Выявить узкие места, определив, что именно замедляет работу (изображения, JavaScript, CSS, сетевые запросы) и как сильно это влияет на пользователей.
  3. Создать план оптимизации, начиная с самых критичных проблем: оптимизировать изображения (форматы, ленивая загрузка), уменьшить размер JavaScript (code splitting, tree shaking) и CSS.
  4. Улучшить производительность рендеринга: избежать layout thrashing, использовать GPU-ускорение для анимаций, виртуализацию списков и минимизацию DOM.
  5. Оптимизировать сетевые запросы и стратегию загрузки ресурсов (preload, prefetch, CDN, кэширование).
  6. Проверить улучшения, сравнив метрики до и после, протестировав на реальных устройствах и медленных соединениях, чтобы убедиться в отсутствии регрессий.

Примеры запросов агенту

Страница загружается слишком долго, особенно на мобильных устройствах. Проанализируй Core Web Vitals и предложи план оптимизации изображений и бандла.
Интерфейс тормозит при скролле длинного списка. Как оптимизировать рендеринг и анимации для достижения 60fps?
Нужно улучшить показатели LCP и CLS. Оцени текущее состояние и примени стратегии оптимизации загрузки критических ресурсов.

Что понадобится

  • Доступ к инструментам анализа производительности (Chrome DevTools, Lighthouse, WebPageTest)
  • Возможность тестирования на реальных устройствах и эмуляции медленных сетей
  • Доступ к исходному коду проекта для внесения изменений в код и конфигурацию сборки

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «pbakaus-optimize» из репозитория: # https://github.com/pbakaus/impeccable
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r pbakaus-optimize/ ~/.claude/skills/pbakaus-optimize/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.