Seite 4 - Web Performance

Incremental Static Regeneration kombiniert die Geschwindigkeit statischer Seiten mit der Aktualität serverseitig gerenderter Inhalte, indem einzelne Seiten im Hintergrund neu generiert werden, ohne einen kompletten Rebuild auszulösen. Wer revalidate, revalidatePath und revalidateTag richtig einsetzt, vermeidet veraltete Inhalte, ohne die Cache-Vorteile zu verlieren.

Jede Webseite durchläuft von der ersten HTML-Zeile bis zum sichtbaren Pixel eine feste Kette aus DOM-Aufbau, CSSOM-Aufbau, Render Tree, Layout, Paint und Compositing. Wer diese sechs Schritte mechanisch versteht, erkennt sofort, warum render-blockierende Skripte und Stylesheets den ersten sichtbaren Inhalt verzögern, und kann mit Preload, Defer und Async gezielt an der richtigen Stelle in der Pipeline eingreifen.

Die -Komponente rendert einen Seitenbereich serverseitig als reines HTML und hydratisiert ihn danach vollkommen isoliert vom Rest der Seite. Alles außerhalb der Insel bleibt statisch und lädt keinerlei Client-JavaScript, was besonders auf inhaltslastigen Seiten die Ladezeit spürbar verbessert.

Ein korrekt konfigurierter Varnish Full Page Cache liefert Magento-Seiten in wenigen Millisekunden aus, doch schon eine einzige falsch gesetzte Cookie-Regel kann die Hit-Rate auf null drücken. Dieser Artikel erklärt VCL-Grundlagen, Magentos default.vcl, ESI-Fragmente für personalisierte Blöcke und die häufigsten Cache-Busting-Fehler samt Debugging-Techniken.

Ein klassischer PHP-FPM-Request gibt seinen kompletten Speicher am Ende automatisch frei, ein Swoole- oder RoadRunner-Worker dagegen lebt über tausende Requests hinweg im selben Prozess. Genau dieser Unterschied macht statischen Zustand, vergessene Closures und wachsende Caches zu einem echten Speicherleck, das über Stunden hinweg langsam den verfügbaren Arbeitsspeicher aufbraucht.

WebAssembly kompiliert Sprachen wie Rust oder C in nahezu nativen Code, der im Browser läuft und rechenintensive Aufgaben deutlich beschleunigen kann. Der Artikel zeigt, wann sich der Umstieg tatsächlich lohnt, wo klassisches JavaScript weiterhin die richtige Wahl ist, und wie eine praktische Implementierung für Bildbearbeitung aussieht.

Ein grosses JavaScript-Bundle kostet nicht nur Download-Zeit, sondern blockiert den Main Thread beim Parsen und Kompilieren. Mit dynamic import(), Vendor-Chunk-Splitting und gezieltem Nachladen schwerer Widgets unterhalb des Folds laesst sich die initiale Bundle-Groesse spuerbar senken, ohne Funktionalitaet zu verlieren, auch in server-gerenderten Hyva-Shops mit Alpine.js.

Ein gewöhnliches Array als Cache mit Objekten als Schlüsseln oder Werten verhindert, dass diese Objekte jemals vom Garbage Collector eingesammelt werden, solange der Cache selbst existiert, und genau das führt in lang laufenden Prozessen zu schleichenden Memory Leaks. WeakMap löst dieses Problem strukturell, indem der Cache selbst keinen Einfluss mehr auf die Lebensdauer der referenzierten Objekte nimmt.

Ein gewöhnliches PHP-Array ist intern eine geordnete Hashtabelle mit erheblichem Overhead pro Element, selbst wenn ausschließlich fortlaufende Integer-Schlüssel verwendet werden. SplFixedArray, SplStack, SplQueue und SplHeap bieten spezialisierte, speichereffiziente Datenstrukturen, die diesen Overhead bei großen, klar strukturierten Datenmengen spürbar reduzieren.

Der Back/Forward Cache hält komplette Seitenzustände im Speicher, sodass eine Zurück- oder Vorwärts-Navigation ohne erneutes Laden auskommt. Dieser Artikel zeigt, welche häufigen Blocker den bfcache verhindern, wie das Chrome DevTools Test-Tool beim Aufspüren hilft, und wie groß der messbare Performance-Gewinn tatsächlich ausfällt.