Seite 15 - JavaScript

Das neue using-Schlüsselwort in JavaScript automatisiert das Freigeben von Ressourcen beim Verlassen eines Scopes — Datenbankverbindungen, Datei-Handles, Locks und Worker werden garantiert aufgeräumt, egal ob der Block normal endet, eine Exception wirft oder ein early return ausgelöst wird.

Shadow DOM kapselt Styles standardmäßig so vollständig, dass globales Tailwind CSS gar nicht erst in eine Web Component gelangt. Mit Constructable Stylesheets, adoptedStyleSheets und dem ::part-Selektor lässt sich diese Kapselung gezielt öffnen, ohne die Isolationsgarantien des Shadow DOM aufzugeben. Dieser Artikel zeigt konkrete Muster für Custom Elements, die Tailwind CSS konsequent nutzen, ohne ihr CSS mehrfach auszuliefern.

Schema-Migration in IndexedDB unterscheidet sich fundamental von serverseitigen Datenbank-Migrationen: Es gibt kein Migrationstool, keine SQL-DDL-Befehle und keinen zentralen Ausführungsort, sondern nur das onupgradeneeded-Event, eine einzelne Versionsnummer und die Verantwortung des Entwicklers, Object Stores und Indexe schrittweise, robust und rückwärtskompatibel zu verändern.

Das Observer Pattern entkoppelt einen Zustandsträger von den Codeteilen, die auf dessen Änderungen reagieren müssen, ganz ohne direkte Referenzen zwischeneinander. Von einer minimalen Subject-Klasse über das native EventTarget-Interface bis zu WeakRef-basiertem Cleanup zeigt dieser Artikel, wie das Observer Pattern in reinem JavaScript robust implementiert wird.

Ein Service Worker ist kein optionales Feature – er ist die Grundlage für Apps, die Nutzern auch bei schlechter oder fehlender Verbindung eine vollständige Erfahrung bieten. Wer Offline-First denkt, baut Apps, die schneller, zuverlässiger und installierbarer sind als klassische Webanwendungen.

Web Worker verlagern rechenintensive JavaScript-Aufgaben wie das Filtern und Sortieren großer Produktlisten in einen eigenen Thread, ohne den Main Thread zu blockieren. Dieser Artikel erklärt, wie Message Passing und Structured Clone funktionieren, wann Transferable Objects den Unterschied machen, wie Comlink die API vereinfacht und wo die praktischen Grenzen von Web Workern liegen.

Generator Functions sind eine der unterschätztesten JavaScript-Funktionen: Sie produzieren Werte on-demand, verarbeiten unendliche Datenströme mit konstantem Speicherbedarf und ermöglichen elegante asynchrone Iteration – ohne externe Bibliotheken und ohne Promise-Callback-Chaos.

Structured Clone kopiert Daten standardmaessig bei jedem postMessage-Aufruf, was bei grossen Binaerdaten spuerbar Zeit kostet. Transferable Objects loesen das durch einen Ownership-Wechsel statt einer Kopie. Dieser Artikel zeigt die Transfer-Liste von postMessage, das neuere ArrayBuffer.prototype.transfer() und typische Fehlerquellen mit detached Buffers.

requestAnimationFrame ist die einzige korrekte Methode, um Animationen im Browser zu implementieren. Wer setTimeout oder setInterval nutzt, kämpft gegen den Rendering-Zyklus statt mit ihm. Dieser Artikel zeigt, wie rAF funktioniert, wie man einen robusten Render-Loop baut und welche Fallen den Frame-Rhythmus zerstören.

Wer TypeScript-Projekte mit Webpack baut, steht vor einer zentralen Entscheidung: volle Typprüfung im Build oder maximale Kompiliergeschwindigkeit. Dieser Artikel zeigt, wie ts-loader, babel-loader und fork-ts-checker-webpack-plugin zusammenspielen, wie eine typsichere webpack.config.ts aufgebaut wird und wann der Wechsel zu esbuild, swc, Vite oder Rspack tatsächlich lohnt.