performance-profiling
Профилирование веб-производительности с Lighthouse
Этот навык помогает разработчикам измерять и оптимизировать производительность веб-приложений с помощью аудитов Lighthouse и инструментов разработчика браузера. Он предоставляет структурированный рабочий процесс для выявления узких мест и улучшения показателей Core Web Vitals.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"performance-profiling" 사용 중입니다. Запустить аудит Lighthouse на моём сайте
예상 결과:
Оценка производительности: 78/100
Ключевые выводы:
- LCP: 2.8s (Требуется улучшение)
- CLS: 0.05 (Хорошо)
- INP: 180ms (Хорошо)
Рекомендации:
1. Устранить ресурсы, блокирующие рендеринг
2. Правильно изменить размер изображений
3. Сократить время выполнения JavaScript
"performance-profiling" 사용 중입니다. Какие пороги Core Web Vitals?
예상 결과:
Пороги Core Web Vitals:
| Метрика | Хорошо | Плохо |
|-------|------|------|
| LCP | < 2.5s | > 4.0s |
| INP | < 200ms | > 500ms |
| CLS | < 0.1 | > 0.25 |
보안 감사
안전Evaluated 11 static security findings. All patterns detected are false positives. The subprocess.run call uses list arguments (not shell=True), preventing command injection. Temp file operations use the safe tempfile module. Documentation examples in SKILL.md are not executable code. The 'cryptographic algorithm' alerts were misidentified keywords. This is a legitimate performance profiling skill with no security concerns.
높은 위험 문제 (2)
중간 위험 문제 (2)
낮은 위험 문제 (1)
품질 점수
만들 수 있는 것
Frontend-разработчик, оптимизирующий скорость загрузки
Frontend-разработчик хочет улучшить производительность загрузки своего веб-приложения. Он использует навык для запуска аудитов Lighthouse, выявления крупнейших узких мест производительности и применения целевых оптимизаций.
DevOps-инженер, настраивающий проверки производительности в CI
DevOps-инженер хочет добавить автоматизированное тестирование производительности в свой CI/CD-пайплайн. Он использует скрипт Lighthouse из навыка для запуска аудитов при каждом развёртывании и отклонения сборок, не достигающих пороговых значений производительности.
Full-stack-разработчик, устраняющий проблемы runtime
Full-stack-разработчик замечает медленные взаимодействия в своём веб-приложении. Он использует навык для профилирования runtime-производительности, выявления длительных задач и поиска утечек памяти с помощью вкладки Memory в DevTools.
이 프롬프트를 사용해 보세요
Run a Lighthouse performance audit on https://example.com using the performance-profiling skill. Show me the performance score and main recommendations.
Using the performance-profiling skill, explain what Core Web Vitals (LCP, INP, CLS) measure and provide tips for improving each metric.
Apply the performance-profiling skill to analyze a large JavaScript bundle. What common issues should I look for and what are the recommended optimization actions?
Using the 4-step profiling workflow from the performance-profiling skill (BASELINE, IDENTIFY, FIX, VALIDATE), help me optimize a slow web application. Start with establishing a baseline.
모범 사례
- Всегда устанавливайте базовую линию производительности перед внесением изменений
- Сосредоточьтесь сначала на крупнейшем узком месте, а не на микрооптимизациях
- Проверяйте улучшения повторными измерениями, чтобы учесть вариативность
피하기
- Угадывание проблем производительности без предварительного профилирования
- Оптимизация кода до выявления фактического узкого места
- Игнорирование данных реальных пользователей в пользу только синтетического тестирования