Seite 103 - Maxim Mironjuk

Vue provide/inject ist der unterschätzte Mittelweg zwischen Prop Drilling und globalen Pinia-Stores. Richtig eingesetzt ermöglicht es scoped Dependency Injection für Komponentenfamilien – typsicher, reaktiv und ohne globalen Zustand.

Realtime-Features in Vue.js sind mehr als ein geöffneter WebSocket. Wer WebSocket, Server-Sent Events und Polling nicht bewusst wählt, baut entweder zu viel Infrastruktur auf oder kassiert unnötige Netzwerklast. Dieser Artikel zeigt alle drei Strategien mit sauberen Composables, Lifecycle-Handling und konkreten Einsatzempfehlungen.

Symfony UX Autocomplete verbindet Doctrine-Entities, eigene Suchlogik und externe APIs mit einem einzigen Formularfeld-Typ und liefert dabei serverseitiges Rendering, Stimulus-Steuerung und Tom Select als Frontend, ohne dass ein einziges eigenes JavaScript-Modul geschrieben werden muss.

Wenn Requests plotzlich haengen, obwohl die CPU-Auslastung niedrig bleibt, steckt oft Lock Contention dahinter. Mit performance_schema in MySQL und pg_locks in PostgreSQL laesst sich Lock Contention systematisch diagnostizieren, statt bei jedem Vorfall aufs Neue zu raten, welche Session welche andere blockiert.

Skeleton-Screens zeigen die spätere Layout-Struktur, bevor echte Daten geladen sind, und reduzieren damit die gefühlte Wartezeit erheblich. Mit Tailwind CSS für Shimmer-Animation und Grundformen sowie Alpine.js für den sauberen Übergang zum echten Inhalt entsteht ein Ladezustand, der Nutzer nicht im Ungewissen lässt.

Klassische Unit-Tests prüfen einzelne, von Hand ausgedachte Beispiele. Property-Based Testing dreht das Prinzip um: Statt Beispiele zu schreiben, definiert man Eigenschaften, die für jede gültige Eingabe gelten müssen, und lässt fast-check tausende zufällige Fälle generieren, um genau die Randfälle zu finden, die ein Mensch beim Schreiben von Tests übersieht.

Ein Dark Mode für Text und Flächen lässt sich mit Tailwinds dark:-Variante meist zügig umsetzen, aber Icons und vor allem komplexe Illustrationen stellen ein eigenes Problem dar. Eine simple CSS-Filter-Invertierung macht aus einer mehrfarbigen Illustration schnell ein unleserliches Farbchaos, weil Invertierung jede Farbe unabhängig von ihrer ursprünglichen Bedeutung umkehrt. Wer stattdessen gezielt mit dark:-Varianten auf SVG-Ebene arbeitet, behält die volle Kontrolle über Fill, Stroke und Kontrast in beiden Modi.

Ein fester Pfad wie /tmp/skript.tmp in einem Shell-Skript ist eine Einladung für Race Conditions, Datenlecks und Symlink-Angriffe. mktemp erstellt garantiert einmalige, sichere temporäre Dateien – und trap EXIT stellt sicher, dass sie in jedem Beendigungsszenario aufgeräumt werden.

Tooltips, Dropdowns und kontextbezogene Overlays wurden jahrelang entweder mit JavaScript oder mit fragilen CSS-Hacks gelöst. CSS Anchor Positioning ändert das grundlegend: anchor(), position-anchor und @position-try ermöglichen präzise, kontextbewusste Positionierung direkt im Stylesheet — ohne eine einzige Zeile JavaScript.

Wer Event-Handler in TypeScript einfach mit any oder dem generischen Event-Typ schreibt, verliert Autovervollstaendigung, riskiert Laufzeitfehler bei falschen Property-Zugriffen und produziert Bugs, die erst im Browser sichtbar werden. Dieser Artikel zeigt, wie MouseEvent, KeyboardEvent und CustomEvent korrekt typisiert werden, wie target und currentTarget sauber genarrowed werden und wie ein typsicherer Event-Emitter Komponenten in Magento- und Hyvae-Frontends robust verbindet.