Zum Inhalt springen
← Zurück zum Blog

Website unter 2 Sekunden: Der Performance-Guide mit Astro 2026

Was Websites wirklich langsam macht – und wie Sie mit Astro, Bildoptimierung und Edge-Hosting messbar unter zwei Sekunden Ladezeit kommen. Schritt für Schritt erklärt.

PerformanceAstroCore Web VitalsWebentwicklung

Eine langsame Website kostet Besucher, Conversions und Sichtbarkeit – in Suchmaschinen genauso wie in KI-Assistenten. Die gute Nachricht: Die Ursachen sind fast immer dieselben, und sie lassen sich gezielt beheben. Dieser Guide zeigt, wie Sie mit Astro messbar unter zwei Sekunden kommen.

Kurz gesagt: Websites werden schnell durch weniger – weniger JavaScript, kleinere Bilder, schlankeres Hosting. Astro setzt genau hier an: Es liefert standardmäßig kein überflüssiges JavaScript aus und optimiert Bilder automatisch. Mit einem strukturierten Performance-Fix sind Ladezeiten unter zwei Sekunden für die meisten KMU-Websites realistisch.

Auf einen Blick

  • Bilder und JavaScript sind fast immer die größten Bremsen.
  • Astro liefert Zero-JS by Default – interaktiver Code lädt nur dort, wo er gebraucht wird.
  • Messen statt raten: PageSpeed Insights und Lighthouse zeigen die Core Web Vitals.
  • Ziel: LCP unter 2,5 s, INP unter 200 ms, CLS unter 0,1.

Warum Ladezeit 2026 entscheidend ist

Web-Performance beschreibt, wie schnell eine Website lädt und auf Eingaben reagiert. Google misst sie über die Core Web Vitals – Largest Contentful Paint (LCP), Interaction to Next Paint (INP) und Cumulative Layout Shift (CLS) – die seit 2021 in die Suchbewertung einfließen. Als gut gelten LCP unter 2,5 Sekunden, INP unter 200 Millisekunden und CLS unter 0,1.

Geschwindigkeit wirkt auf drei Ebenen gleichzeitig:

  • Nutzer: Je länger eine Seite lädt, desto mehr Besucher springen ab – besonders auf dem Smartphone und im Mobilfunknetz.
  • Suchmaschinen: Die Page Experience ist ein bestätigter Rankingfaktor von Google.
  • KI-Assistenten: Schnelle, sauber strukturierte Seiten werden von Crawlern zuverlässiger erfasst – die Grundlage dafür, in ChatGPT, Perplexity oder Google AI Overviews überhaupt zitiert zu werden.

Was bremst eine Website aus? Die größten Performance-Killer

In meinen Audits tauchen immer wieder dieselben vier Ursachen auf:

Performance-KillerWarum es bremstTypischer Hebel
Zu viel JavaScriptJedes Skript muss geladen, geparst und ausgeführt werden – besonders teuer auf schwachen Smartphones.Skripte reduzieren, nur Nötiges hydrieren
Unoptimierte BilderMeist der größte Posten beim Seitengewicht; riesige PNG/JPEG ohne passende Größe.Moderne Formate, richtige Maße, Lazy Loading
Render-blockierende RessourcenCSS und Skripte im Seitenkopf verzögern die erste Darstellung.Critical CSS, Skripte ans Ende / defer
Langsames HostingLange Serverantwortzeiten verzögern alles Weitere.Edge-/CDN-Hosting nahe am Nutzer

Der gemeinsame Nenner: Es wird zu viel ausgeliefert, was gar nicht gebraucht wird.

Wie Astro das Problem an der Wurzel löst

Statt Performance nachträglich „draufzubügeln”, verhindert Astro die typischen Bremsen schon im Aufbau.

  • Zero-JS by Default: Eine Astro-Seite ist im Standard reines HTML und CSS. JavaScript kommt nur dazu, wenn Sie es explizit anfordern.
  • Islands Architecture (Partial Hydration): Partial Hydration bedeutet, dass nur einzelne interaktive Bereiche einer Seite JavaScript laden – die übrige Seite bleibt statisches HTML. Ein Buchungswidget wird interaktiv, der umgebende Text nicht.
  • Automatische Bildoptimierung: Astros integrierte <Image>-Komponente erzeugt moderne Formate (WebP/AVIF) und passende Größen automatisch.

So sieht optimierte Bild-Einbindung in Astro konkret aus:

---
import { Image } from 'astro:assets';
import hero from '../assets/team-muenchen.jpg';
---
<Image
  src={hero}
  alt="Beratungsgespräch in München"
  width={1200}
  format="avif"
  loading="lazy"
/>

Astro liefert das Bild dadurch automatisch in einem modernen, kleineren Format, in der passenden Größe und erst, wenn es gebraucht wird.

Performance-Fix: Schritt für Schritt

So gehe ich einen Performance-Fix systematisch an:

  1. Messen (Audit). Ausgangswerte mit PageSpeed Insights und Lighthouse aufnehmen – mobil und mit gedrosselter Verbindung. Ohne Messung optimiert man ins Blaue.
  2. Bilder optimieren. Der schnellste Hebel: moderne Formate (WebP/AVIF), Bilder nur so groß ausliefern wie angezeigt, alles „below the fold” lazy laden.
  3. JavaScript reduzieren. Überflüssige Skripte und Tracker entfernen, interaktive Teile auf das Nötigste begrenzen. Bei Astro: nur die Komponenten hydrieren, die es wirklich brauchen.
  4. Render-Blocker auflösen. Kritisches CSS inline, nicht-kritische Skripte mit defer ans Ende verschieben.
  5. Schriften optimieren. Web-Fonts lokal einbinden, auf wenige Schnitte beschränken und font-display: swap nutzen, damit Text sofort sichtbar ist.
  6. Schnell hosten. Statische Astro-Seiten auf einem Edge-/CDN-Anbieter wie Cloudflare Pages, Netlify oder Vercel ausliefern – nah am Nutzer, mit kurzen Antwortzeiten.

Reihenfolge zählt: Bilder und JavaScript bringen erfahrungsgemäß den größten Sprung. Wer dort anfängt, sieht die deutlichsten Verbesserungen zuerst.

Welche Ergebnisse realistisch sind

Seriös lässt sich kein pauschaler Prozentwert versprechen – die Verbesserung hängt vom Ausgangszustand ab. Aussagen lässt sich aber, welcher Hebel welchen Messwert verbessert:

MaßnahmeVerbesserter Core Web Vital
Bilder optimieren & korrekt dimensionierenLCP (schnellere Hauptinhalt-Darstellung)
Feste Bildmaße / reservierter PlatzCLS (kein Springen des Layouts)
JavaScript reduzierenINP (schnellere Reaktion auf Eingaben)
Edge-HostingLCP & TTFB (kürzere Serverantwort)

Eine Seite, die zuvor mehrere Sekunden brauchte und viel JavaScript geladen hat, landet nach einem konsequenten Fix in der Praxis meist klar im grünen Bereich der Core Web Vitals. Entscheidend ist, dass die Werte gemessen und nicht geschätzt werden.

Fazit und nächster Schritt

Schnelle Websites entstehen nicht durch nachträgliches Optimieren, sondern durch weniger Ballast von Anfang an: schlankes JavaScript, optimierte Bilder, schnelles Hosting. Astro macht diesen Weg zum Standard statt zur Ausnahme.

Mehr zu den Denkfehlern dahinter lesen Sie in 3 Performance-Mythen, die deine Website langsam machen. Und wenn ein kompletter Neustart ansteht, zeigt dieser Artikel, wie eine schnelle KMU-Website in unter 3 Tagen entsteht.

Nächster Schritt: Sie wollen wissen, wo Ihre Seite konkret steht? Ein gezielter Performance-Fix beginnt mit einer Messung – und einem klaren Plan.

Quellen

Häufige Fragen

Wie messe ich die Ladezeit meiner Website?

Am einfachsten mit Googles PageSpeed Insights und dem in Chrome integrierten Lighthouse. Beide messen die Core Web Vitals – LCP, INP und CLS – und zeigen konkrete Optimierungsvorschläge. Wichtig ist der Test auf dem Smartphone und bei langsamer Verbindung, denn dort entscheidet sich die wahrgenommene Geschwindigkeit.

Was sind die größten Performance-Killer auf Websites?

Die vier häufigsten Bremsen sind zu viel JavaScript, unoptimierte Bilder, render-blockierende Ressourcen und langsames Hosting. Bilder und JavaScript machen dabei meist den größten Teil des Seitengewichts aus.

Wie verbessert Astro die Ladezeit einer Website?

Astro liefert standardmäßig kein überflüssiges JavaScript aus (Zero-JS by Default) und lädt interaktive Komponenten nur dort, wo sie gebraucht werden (Islands Architecture). Zusätzlich optimiert die integrierte Image-Komponente Bilder automatisch in moderne Formate wie WebP und AVIF.

Was ist Partial Hydration bzw. die Islands Architecture?

Partial Hydration bedeutet, dass nur einzelne interaktive Bereiche einer Seite JavaScript laden – die sogenannten Islands. Der Rest der Seite bleibt statisches HTML. So lädt der Browser nur den Code, der wirklich gebraucht wird, statt der gesamten Anwendung.

Lohnt sich eine Migration zu Astro nur wegen der Performance?

Wenn eine Seite vor allem Inhalte zeigt – Leistungen, Kontakt, Referenzen – und unter zu viel JavaScript oder Plugin-Ballast leidet, bringt ein Umstieg auf Astro oft den größten Performance-Hebel. Bei stark interaktiven Anwendungen oder häufiger redaktioneller Pflege durch Nicht-Techniker sollte man die Entscheidung breiter abwägen.