Performance·Cursor
PerformanceCursor

Largest Contentful Paint (LCP) verbessern — Cursor

LCP misst wie schnell der Haupt-Content erscheint. Langsames LCP verliert Besucher und Rankings. Hauptverdächtige: unoptimierte Hero-Bilder und render-blockierende Scripts.

rocket_launch

In Cursor fixen

Agentischer AI-Code-Editor auf VSCode-Basis

In Cursor editierst du echte Dateien — der Fix landet per direkten Diff statt neu generiertem Projekt. Prompt unten in deinen Cursor-Chat einfügen und der Fix rollt in einem Rutsch über das ganze Projekt aus.

Anderes Tool? Wähle deinen Stack:

LovableCursorBoltv0ReplitWindsurfClaude CodeBase44

Der Prompt für Cursor

Diesen Text exakt so in deinen Cursor-Chat kopieren und einfügen.

Apply these changes to my codebase. Edit the files directly and keep existing formatting:

Improve Largest Contentful Paint

1. Preload the LCP image with <link rel="preload" as="image">.
2. Optimize the image format (use WebP/AVIF) and compress it.
3. Remove render-blocking resources above the fold.

Warum das wichtig ist

LCP ist eines der drei Core Web Vitals und das Vital das User am stärksten fühlen. Es ist "wann sieht die Seite fertig aus". Über 4s verdoppelt Bounce auf Mobile fast.

Google nutzt LCP als Ranking-Signal (Teil vom Page-Experience-Score). Sites die LCP verfehlen werden auf Mobile abgestuft.

So nutzt du diesen Prompt in Cursor

  1. 1. Dein Cursor-Projekt öffnen.
  2. 2. Prompt oben mit Copy-Button kopieren.
  3. 3. In Cursor-Chat einfügen und senden.
  4. 4. Diff reviewen, Änderungen akzeptieren, neu deployen.
  5. 5. Fix mit der Checkliste unten verifizieren.

Typische Fehler vermeiden

  • error_outlineLCP-Bild lazy-loaden — wird langsamer, nicht schneller.
  • error_outline3MB JPEG ausliefern wenn 200KB WebP reichen würden.
  • error_outlineAnalytics/Chat-Widgets synchron vor Content laden.
  • error_outlineLangsame DNS/CDN für Main-Origin.

Wie du prüfst ob der Fix geklappt hat

  • check_circlePageSpeed Insights → LCP-Wert < 2.5s auf Mobile.
  • check_circleDevTools-Performance-Tab — LCP-Event unter 2.5s.
  • check_circleCrUX (Chrome UX Report) in GSC — LCP "Gut"-Schwelle getroffen.

Häufige Fragen

Was zählt als LCP-Element?expand_more
Der grösste sichtbare Content-Block im initialen Viewport — meist Hero-Bild oder Headline. In DevTools-Performance-Tab checken.
Hilft Preloading wirklich?expand_more
Ja — `<link rel="preload" as="image">` fürs LCP-Bild schneidet oft 300-800ms auf Mobile.

Alle 34 Prompts passend zu deiner Cursor-Site?

Pantra scannt deine Site in 10 Sekunden, erkennt den Stack und generiert genau die Prompts die passen — nur die du brauchst.

Site scannen

Ähnliche Cursor-Prompts

Performance

Cumulative Layout Shift (CLS) fixen — Cursor

Prompt um CLS zu eliminieren — width/height auf Bilder, Platz für Ads reservieren, late-loading Fonts vermeiden.

Performance

Interaction to Next Paint (INP) verbessern — Cursor

Prompt um INP unter 200ms zu kriegen — lange Tasks splitten, schweres JS lazy-loaden, Handler debouncen.

Bilder

Bilder zu WebP oder AVIF konvertieren — Cursor

Prompt um JPEG/PNG zu WebP oder AVIF zu konvertieren — 30-50% kleiner bei gleicher Qualität. Hilft LCP und CLS.

Performance

Core Web Vitals fixen (LCP, CLS, INP) — Cursor

Prompt um Googles Core-Web-Vitals-Schwellen zu treffen: LCP < 2.5s, CLS < 0.1, INP < 200ms. Funktioniert in jedem AI-Stack.

Mehr im Glossar erfahrenarrow_forward