Im Browser entscheidet sich, wie schnell eine Seite wirklich wirkt. Diese Kategorie sammelt Beiträge zur Frontend-Seite der Optimierung: Bildformate und responsive Bildgrößen, Schriftarten und deren Ladeverhalten, CSS-Auslieferung und kritische Stile, JavaScript-Bündel und deren Aufteilung, verzögertes Nachladen, Drittanbieter-Skripte und ihre Nebenwirkungen. Wir erklären, wie Layoutsprünge entstehen und wie man sie mit reservierten Flächen vermeidet, warum Interaktivität unter langen Aufgaben leidet und welche Techniken die Hauptarbeit im Browser reduzieren. Jeder Beitrag beschreibt Messung vor und nach der Änderung, damit sich der Effekt einer Maßnahme beziffern lässt statt vermuten. Ergänzend geht es um Zusammenarbeit: welche Anforderungen an Gestaltung und Redaktion verhindern, dass jede neue Seite die Ladezeit wieder verschlechtert.
Auf dieser Seite finden Sie alle Beiträge zum Thema „Frontend-Optimierung“. Die neuesten Beiträge stehen oben.
Unter jedem Titel steht ein kurzer Text zum Inhalt. Klicken Sie auf einen Beitrag. Dann lesen Sie den ganzen Text.
Über der Liste stehen auch die anderen Themen. Unten führt ein Link zurück zu allen Beiträgen.
Chrome 155 und Firefox 158 dekodieren JPEG XL. Wann sich das Format neben AVIF und WebP für Shops lohnt und wie Sie JPEGs verlustfrei umpacken und ausliefern.
Domain-Sharding, Sammeldateien, Sprites und Data-URIs stammen aus der HTTP/1.1-Zeit. Wie Sie sie im Wasserfall erkennen und unter HTTP/2 sicher zurückbauen.
Warum das Karussell im Kopfbereich oft das LCP-Element ist, wie Autoplay den CLS treibt und wie ein Slider schnell lädt, stabil bleibt und sich anhalten lässt.
Warum Stilberechnung zur Laufzeit Zeit kostet, wie Selector Stats und Long Animation Frames den Anteil sichtbar machen und welche Eingriffe den Umfang senken.
Warum Anti-Flimmer-Schichten den LCP verschieben, wie sich der Anteil messen lässt und welche Aufbauten einen Test tragen, ohne die Seite zu verstecken.
Wie viel CSS eine Seite braucht, wie sich der ungenutzte Anteil messen lässt und in welcher Reihenfolge sich Ballast ohne Darstellungsschäden entfernen lässt.
Die Oberfläche startet schnell und wird nach zwanzig Minuten zäh: wie Speicherlecks im Frontend entstehen, wie man sie im Verlauf misst und wieder loswird.
Native, GPU-beschleunigte Seitenwechsel im Shop ohne JavaScript-Framework: Wie Cross-Document View Transitions den Sprung von Kategorie zu Produkt glätten.
Wie ein Service Worker mit Precaching kritische Dateien lokal vorhält, wiederkehrende Besuche fast ohne Server-Roundtrip lädt und wann sich der Aufwand lohnt.
content-visibility und CSS-Containment begrenzen die Rendering-Arbeit langer Seiten auf den sichtbaren Bereich - mit Platzhalterhöhen ohne neue Layout-Sprünge.
Compression Dictionary Transport nach RFC 9842: Wie Browser und Server Bundles als Delta gegen die Vorversion ausliefern - Muster, Konfiguration, Fallback.
Wie der Back-Forward-Cache ganze Seiten im Speicher hält und Zurück-Navigationen sofort macht: Blocker, Cache-Control: no-store und Tests in den DevTools.
Wie die Speculation Rules API Folgeseiten prefetcht oder prerendert, Eagerness richtig tunt, verschwendete Prerenders und Analytics-Nebenwirkungen vermeidet.
Wie fetchpriority='high' das LCP-Bild früher lädt: korrekte Anwendung, Zusammenspiel mit preload und srcset, die häufigsten Fehler und der LCP-Quick-Win.
Wie preload, prefetch, preconnect, dns-prefetch, Priority Hints den Verbindungsaufbau kürzen, LCP-Bild und Schriften beschleunigen – und wo Überladung schadet.
Lazy Loading für Bilder, routenbasiertes Code-Splitting und dynamische Importe senken das initiale JavaScript spürbar und verbessern die Core Web Vitals.
Web-Fonts kosten Ladezeit und verursachen Layout-Shifts. So optimieren Sie Schriften mit font-display, Preload, Subsetting und WOFF2 für schnelle Seiten.
Video als unterschätzter Ladezeit-Treiber: Poster als LCP-Kandidat, sparsames preload, moderne Codecs und Fassaden für eingebettete Player statt Autoplay.
Flüssige Animationen ohne Ruckeln: das 16,7-ms-Frame-Budget, warum nur transform und opacity günstig sind und wie Sie Frontend-Jank in den DevTools aufspüren.