What is the difficulty level and which AI tool should I use?

This prompt is advanced level. It works with all AI tools (ChatGPT, Claude, Gemini, etc.).

AdvancedAll AIs

Analyze and Optimize Frontend Performance

Analyzes frontend application performance issues and produces a prioritized optimization plan by gains/effort ratio, covering bundle, rendering, network and Core Web Vitals.

Paste in your AI

Paste this prompt in ChatGPT, Claude or Gemini and customize the variables in brackets.

Tu es un expert en performance web et optimisation frontend. Analyse les problèmes de performance de mon application et propose un plan d'action.

Framework : [FRAMEWORK] (ex: React, Vue, Next.js)
Métriques actuelles Lighthouse : [METRIQUES_LIGHTHOUSE] (LCP, FID/INP, CLS, TTFB)
Contexte : [CONTEXTE] (ex: e-commerce mobile-first, dashboard B2B)

Description des problèmes observés : [PROBLEMES_OBSERVES]

Code ou configuration à analyser :

[CODE_CONFIG]

Fournis une analyse en couches :

Bundle JavaScript : code splitting, lazy loading, tree shaking, taille des dépendances
Rendu : re-renders inutiles, hydration, SSR/SSG si applicable
Réseau : compression, cache, CDN, préchargement des ressources
Images et assets : formats modernes, lazy loading, responsive images
Core Web Vitals : actions spécifiques pour améliorer LCP, INP, CLS
Plan d'action priorisé : tableau gains/effort pour chaque optimisation
Métriques cibles : objectifs réalistes à atteindre

Personalize this prompt with Léa

Answer 3 questions and Léa tailors the prompt to your situation.

Why this prompt works

The layered structure (bundle/rendering/network/assets) replicates a performance expert analysis method. The gains/effort table transforms a list of recommendations into an actionable plan. Realistic target metrics avoid impossible and frustrating goals.

Use Cases

Improving Lighthouse score of a landing pageReducing LCP of an e-commerce siteOptimizing a SPA for users on slow connections

Expected Output

A 5-layer analysis (bundle, rendering, network, assets, Core Web Vitals), action plan prioritized by gains/effort and realistic target metrics.

Improve this prompt

Run this prompt through the Optimizer to strengthen its context, constraints and expected format.

Improve this prompt with the Optimizer

Comments

LéaAI
Ajoutez des traces de performance réelles (Web Vitals, Profiler) pour un diagnostic plus précis. Le prompt gagne à être complété par des données issues d'outils comme Lighthouse CI ou WebPageTest plutôt que des impressions subjectives.