prefetch
Teaches resource prefetching strategies for faster navigation. Use when you can predict which resources the user will need next and want to load them during idle time.
AIpatternsdev
official
Другое
Что делает навык
Навык реализует оптимизацию Prefetch (через <link rel="prefetch">, HTTP-заголовки, Service Workers или Webpack) для загрузки ресурсов, необходимых для последующих маршрутов, до момента их фактического использования. Это снижает воспринимаемое время загрузки при навигации, если известно, какие ресурсы понадобятся пользователю в ближайшее время.
Когда применять
- Когда известно, что пользователь с высокой вероятностью перейдет на определенные маршруты или страницы.
- Когда требуется уменьшить воспринимаемое время загрузки при последующих навигациях.
- Когда ресурсы могут быть загружены декларативно в HTML, через HTTP-заголовки, Service Workers или с помощью Webpack.
Как работает
- Определить ресурсы, которые пользователь, вероятно, понадобится в ближайшее время.
- Выбрать метод реализации: декларативный в HTML, HTTP-заголовок Link, Service Workers или кастомные решения (например, Webpack).
- Настроить загрузку ресурсов во время простоя (idle time), чтобы не конкурировать с критическими запросами.
- Избегать префетчинга ресурсов, которые вряд ли понадобятся, чтобы не тратить пропускную способность.
- Не использовать префетчинг на соединениях с низкой пропускной способностью или с лимитом трафика.
- Не префетчить ресурсы, которые часто меняются и могут стать неактуальными к моменту использования.
Примеры запросов агенту
Добавь тег <link rel="prefetch"> для скрипта чата, так как пользователь, вероятно, откроет страницу контактов.
Настрой HTTP-заголовок Link для префетчинга JS-файла виджета, так как он нужен на следующей странице.
Используй Service Worker для префетчинга ресурсов, необходимых для следующего маршрута, во время простоя.
Описание составлено по SKILL.md навыка, сверено 05.10.2026.
Как подключить
1Скачать навык
# возьмите папку навыка «prefetch» из репозитория:
# https://github.com/patternsdev/skills
2Положить папку с
SKILL.md к навыкам ассистента# положите папку навыка туда, где ассистент ищет skills:
cp -r prefetch/ ~/.claude/skills/prefetch/
Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.