modern-web-guidance
modern-web-guidance — официальный навык команды Google Chrome для поиска актуальных практик современной веб-разработки. Его задача не в том, чтобы автоматически переписать интерфейс, а в том, чтобы перед началом работы найти подходящее проверяемое руководство и применить его к конкретному HTML, CSS или client-side JavaScript сценарию. В SKILL.md прямо сказано запускать этот поиск первым при задачах с модальными окнами, диалогами, popover, backdrop-filter, anchor positioning, container queries, :has(), :user-valid, View Transitions, scroll-driven animations, параллаксом, раскрытием контента при прокрутке, Core Web Vitals, content-visibility, Fetch Priority, оптимизацией изображений, WebUSB, WebSockets, WebAssembly, React, Vue, Angular, формами, autofill, состояниями компонентов и другими современными браузерными возможностями. Такой охват делает навык полезным в момент выбора нативного API или CSS-механизма, когда легко написать локальное решение, уже существующее в стандартах. Основной workflow состоит из двух шагов. Сначала нужно сформулировать action-oriented запрос о желаемом результате и выполнить search через npx: npx -y modern-web-guidance@latest search <query> --skill-version 2026_05_16-c5e78707. Ответом служит JSON-массив найденных руководств с id, описанием, категорией, использованными функциями, примерным tokenCount и similarity. Если результат слишком общий, пустой или имеет низкую релевантность, исходная инструкция предлагает перейти к list и просмотреть доступные guides. После выбора id выполняется retrieve; несколько идентификаторов можно передать через запятую. Это означает, что навык помогает сначала сузить задачу до конкретного паттерна, а потом получить полное руководство, а не выдаёт абстрактный список советов. Навык не предназначен для SQL, ORM, Express API routes, CI/CD, Docker, Git, ESLint и обычных локальных Python или Go-скриптов. Эти исключения важны: запускать его на любой технический вопрос подряд не следует. Руководства обычно framework-agnostic, поэтому найденные рекомендации нужно адаптировать к реальному стеку проекта, не приписывая guide поведения, которого в нём нет. Если совпадений нет, безопаснее зафиксировать отсутствие релевантного guide и продолжить проверку доступными первоисточниками, чем выдумать идентификатор или сделать вид, что поиск что-то подтвердил. Отдельная часть навыка посвящена исполнению команд. Для npx нужен сетевой доступ к пакету; в Windows вместо npx используется npx.cmd. Если запуск зависает, это может означать отсутствие сети, поэтому предусмотрен повтор в offline-режиме. Параметр --skill-version нужен, чтобы увидеть предупреждение об устаревшем SKILL.md. Эти условия полезно проверять до интерпретации результата поиска: отсутствие ответа команды не является доказательством отсутствия веб-практики. Вопрос совместимости решается через Baseline. По умолчанию guides считают безопасными функции, которые широко доступны в Baseline. Для функций вне Baseline нужно следовать fallback-рекомендациям самого guide, если проект не задал собственную политику браузеров. Если команда явно поддерживает, например, Safari 17.4+, экспериментальный runtime или, наоборот, запрещает полифиллы, это ограничение надо учесть при выборе рекомендации. При отсутствии такой политики навык предлагает заметить сигналы риска — ограниченный runtime, вопросы о размере бандла или сложность fallback — и заранее зафиксировать правило поддержки в AGENTS.md или другом каноническом месте. Поэтому практическая ценность modern-web-guidance — в проверяемом поиске, актуальном контексте браузеров и уменьшении самодельных решений, а не в обещании универсальной совместимости без проверки.
Для чего подходит
- Выбор современных Web API и CSS
- Проверка browser compatibility
- Улучшение accessibility и Core Web Vitals
Установка
Сначала прочитайте SKILL.md и scripts в исходном репозитории. Затем выполните команду в каталоге проекта:
npx skills add https://github.com/GoogleChrome/modern-web-guidance/tree/main/skills/modern-web-guidance