performance-profiling
Analyser les performances web avec Lighthouse
Cette compétence aide les développeurs à mesurer et optimiser les performances des applications web grâce aux audits Lighthouse et aux outils de développement du navigateur. Elle fournit un workflow structuré pour identifier les goulots d'étranglement et améliorer les scores Core Web Vitals.
Télécharger le ZIP du skill
Importer dans Claude
Allez dans Paramètres → Capacités → Skills → Importer un skill
Activez et commencez à utiliser
Tester
Utilisation de "performance-profiling". Exécuter un audit Lighthouse sur mon site web
Résultat attendu:
Score de performance : 78/100
Principales conclusions :
- LCP : 2,8s (À améliorer)
- CLS : 0,05 (Bon)
- INP : 180ms (Bon)
Recommandations :
1. Éliminer les ressources bloquant le rendu
2. Dimensionner correctement les images
3. Réduire le temps d'exécution JavaScript
Utilisation de "performance-profiling". Quels sont les seuils des Core Web Vitals ?
Résultat attendu:
Seuils des Core Web Vitals :
| Métrique | Bon | Médiocre |
|----------|-----|----------|
| LCP | < 2,5s | > 4,0s |
| INP | < 200ms | > 500ms |
| CLS | < 0,1 | > 0,25 |
Audit de sécurité
SûrEvaluated 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.
Problèmes à risque élevé (2)
Problèmes à risque moyen (2)
Problèmes à risque faible (1)
Score de qualité
Ce que vous pouvez construire
Développeur frontend optimisant la vitesse de chargement
Un développeur frontend souhaite améliorer les performances de chargement de son application web. Il utilise cette compétence pour exécuter des audits Lighthouse, identifier les principaux goulots d'étranglement de performance et appliquer des optimisations ciblées.
Ingénieur DevOps configurant des vérifications de performance CI
Un ingénieur DevOps souhaite ajouter des tests de performance automatisés à son pipeline CI/CD. Il utilise le script Lighthouse de la compétence pour exécuter des audits à chaque déploiement et faire échouer les builds qui tombent sous les seuils de performance.
Développeur full-stack résolvant des problèmes d'exécution
Un développeur full-stack remarque des interactions lentes sur son application web. Il utilise cette compétence pour profiler les performances d'exécution, identifier les tâches longues et trouver les fuites de mémoire à l'aide de l'onglet Mémoire de DevTools.
Essayez ces prompts
Exécutez un audit de performance Lighthouse sur https://example.com en utilisant la compétence performance-profiling. Affichez-moi le score de performance et les principales recommandations.
En utilisant la compétence performance-profiling, expliquez ce que mesurent les Core Web Vitals (LCP, INP, CLS) et fournissez des conseils pour améliorer chaque métrique.
Appliquez la compétence performance-profiling pour analyser un bundle JavaScript volumineux. Quels problèmes courants dois-je rechercher et quelles sont les actions d'optimisation recommandées ?
En utilisant le workflow de profilage en 4 étapes de la compétence performance-profiling (BASELINE, IDENTIFY, FIX, VALIDATE), aidez-moi à optimiser une application web lente. Commencez par établir une base de référence.
Bonnes pratiques
- Toujours établir une base de référence de performance avant d'apporter des modifications
- Se concentrer d'abord sur le goulot d'étranglement le plus important plutôt que sur les micro-optimisations
- Valider les améliorations avec des mesures répétées pour tenir compte de la variance
Éviter
- Deviner les problèmes de performance sans profiler d'abord
- Optimiser le code avant d'identifier le goulot d'étranglement réel
- Ignorer les données utilisateurs réelles en faveur des tests synthétiques uniquement