Skills Addyosmani

Проводить аудит и улучшать веб-доступность в соответствии с рекомендациями WCAG 2.2. Использовать по запросам «улучшить доступность», «аудит a11y», «соответствие WCAG», «поддержка экранных дикторов», «навигация с клавиатуры» или «сделать доступным».

Руководство по стабильному проектированию API и интерфейсов. Используйте при проектировании API, границ модулей или любого публичного интерфейса. Используйте при создании REST или GraphQL эндпоинтов, определении контрактов типов между модулями или установлении границ между фронтендом и бэкендом.

Применяйте современные лучшие практики веб-разработки для обеспечения безопасности, совместимости и качества кода. Используйте, когда вас просят «применить лучшие практики», «провести аудит безопасности», «модернизировать код», «проверить качество кода» или «проверить на уязвимости».

Тестирует в реальных браузерах через Chrome DevTools MCP. Используйте при сборке или отладке всего, что работает в браузере. Используйте, когда нужно проверить DOM, захватить ошибки консоли, проанализировать сетевые запросы, профилировать производительность или проверить визуальный вывод с реальными данными времени выполнения. Требует настройки MCP-сервера chrome-devtools.

Автоматизирует настройку CI/CD пайплайнов. Используйте при настройке или изменении пайплайнов сборки и развертывания. Используйте, когда необходимо автоматизировать контроль качества, настроить тестовые раннеры в CI или определить стратегии развертывания.

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

Упрощает код для повышения читаемости. Используйте при рефакторинге кода для ясности без изменения поведения. Используйте, когда код работает, но его сложнее читать, поддерживать или расширять, чем следовало бы. Используйте при проверке кода, который накопил излишнюю сложность.

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

Оптимизация Core Web Vitals (LCP, INP, CLS) для улучшения пользовательского опыта и ранжирования в поиске. Используйте, когда вас просят «улучшить Core Web Vitals», «исправить LCP», «уменьшить CLS», «оптимизировать INP», «оптимизация пользовательского опыта» или «исправить смещение макета».

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

Управляет устареванием и миграцией. Используйте при удалении старых систем, API или функций. Используйте при миграции пользователей с одной реализации на другую. Используйте при принятии решения о поддержке или прекращении использования существующего кода.

Записывает решения и документацию. Используйте при принятии архитектурных решений, изменении публичных API, выпуске функций или когда необходимо зафиксировать контекст, который будущие инженеры и агенты должны будут понимать в кодовой базе.

Подвергает каждое нетривиальное решение свежеконтекстному состязательному анализу, прежде чем оно будет принято. Используйте, когда корректность важнее скорости, при работе с незнакомым кодом, когда ставки высоки (продакшн, критичная с точки зрения безопасности логика, необратимые операции) или в любой ситуации, когда уверенный результат будет дешевле проверить сейчас, чем отлаживать позже.

Создаёт пользовательские интерфейсы производственного качества, доступные, адаптивные и ориентированные на пользователя. Используйте при создании или изменении интерфейсов и страниц, разработке компонентов, реализации макетов, выполнении требований доступности WCAG, управлении состоянием или когда результат должен выглядеть и ощущаться как продукт производственного качества, а не как сгенерированный ИИ.

Структурирует практики git-воркфлоу. Используй при любом изменении кода. Используй при коммитах, ветвлении, разрешении конфликтов или когда нужно организовать работу в нескольких параллельных потоках. Используй при создании релиза, выборе семантического версионирования, тегировании или написании changelog.

Преобразует сырые идеи в чёткие, реализуемые концепции с помощью структурированного дивергентного и конвергентного мышления. Используйте, когда идея ещё расплывчата, когда нужно проверить предположения на прочность перед принятием плана или когда требуется расширить варианты перед выбором одного. Запускается по запросам «сгенерировать идею», «доработать эту идею» или «проверить мой план на прочность».

Вносит изменения поэтапно. Используйте при реализации любой функции или изменения, затрагивающего более одного файла. Используйте, когда собираетесь написать большой объём кода за один раз или когда задача кажется слишком объёмной для выполнения за один шаг.

Извлекает то, чего пользователь на самом деле хочет, а не то, что, по его мнению, он должен хотеть. Достигает этого через интервью по одному вопросу за раз, пока не будет достигнута уверенность ~95% в истинном намерении. Используйте, когда запрос недостаточно конкретен («сделай мне X» без указания «для кого» или «почему сейчас»), когда пользователь явно просит об этом («опроси меня», «проверь меня», «мы уверены?», «проверь мои мысли на прочность») или когда вы замечаете, что молча заполняете неоднозначные требования до того, как появится какой-либо план, спецификация или код.

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

Оптимизация веб-производительности для более быстрой загрузки и улучшения пользовательского опыта. Используйте, когда вас просят «ускорить мой сайт», «оптимизировать производительность», «сократить время загрузки», «исправить медленную загрузку», «улучшить скорость страницы» или «аудит производительности».

Оптимизирует производительность приложений на уровне фронтенда, бэкенда, запросов и баз данных. Используйте, когда есть требования к производительности, при подозрении на регрессию производительности, когда необходимо улучшить Core Web Vitals или время загрузки, когда нужно исправить паттерны N+1 запросов или когда профилирование выявляет узкие места.

Разбивает работу на упорядоченные задачи. Используйте, когда есть спецификация или четкие требования и нужно разбить работу на выполнимые задачи. Используйте, когда задача кажется слишком большой для начала, когда нужно оценить объем или когда возможна параллельная работа.

Укрепляет код от уязвимостей. Используйте при обработке пользовательского ввода, аутентификации, хранении данных или внешних интеграциях. Используйте при создании любой функции, которая принимает непроверенные данные, управляет пользовательскими сессиями или взаимодействует со сторонними сервисами.

Оптимизация для видимости и ранжирования в поисковых системах. Используется, когда требуется «улучшить SEO», «оптимизировать для поиска», «исправить мета-теги», «добавить структурированные данные», «оптимизация карты сайта» или «поисковая оптимизация».

Подготавливает производственные запуски. Используйте при подготовке к развертыванию в production. Используйте, когда нужен предзапускной чек-лист, при настройке мониторинга, при планировании поэтапного развертывания или когда требуется стратегия отката.

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

Создаёт спецификации перед написанием кода. Используйте при запуске нового проекта, функции или значительного изменения, если спецификация ещё не существует. Используйте, когда требования неясны, двусмысленны или существуют лишь в виде смутной идеи.

Управляет разработкой через тесты. Используйте при реализации любой логики, исправлении любой ошибки или изменении любого поведения. Используйте, когда нужно доказать, что код работает, когда поступает отчёт об ошибке или когда вы собираетесь изменить существующую функциональность.

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

Комплексный аудит качества веб-сайта, охватывающий производительность, доступность, SEO и лучшие практики. Используйте, когда вас просят «проверить мой сайт», «оценить качество веб-страницы», «запустить аудит Lighthouse», «проверить качество страницы» или «оптимизировать мой веб-сайт».