Revision 694: React- & TypeScript-Glücksrad, mit Hans-Christian Otto
In dieser Revision drehen wir nochmal das Glücksrad – allerdings zum Themenbereich TypeScript und React. Gemeinsam mit unserem Gast Kiki (Hans-Christian Otto), seines Zeichens Paramount Leader von Suora, picken wir zufällige React- und TypeScript-Themen und arbeiten uns von dort aus tief in Parallelwelten, Typsysteme, Debugging-Philosophie und die Grenzen statischer Analyse vor. Es geht um React DevTools, Web Components, any vs. unknown, TypeScript-Overloads, Decorators und die Frage, warum HTML kaputt sein darf – und vermutlich immer bleiben wird.
- [00:03:37] React
useDebugValue useDebugValueist ein React-Hook, mit dem sich Zusatzinformationen in den React DevTools anzeigen lassen. Im Kern eine Art strukturierter Debug-Output, der besonders hilft, wenn dieselbe Komponente mehrfach im Tree auftaucht.- [00:27:28] Debugging in React & DevTools
Wir vergleichen klassisches Browser-Debugging mit React-Debugging und diskutieren, warum React eigene DevTools braucht: synthetische Events, virtueller DOM und eine parallele Realität zur Web-Plattform.
- [00:39:00] Web Components & Custom Elements
Exkurs in die Welt der Web Components: Warum Debugging dort oft einfacher ist, weil es keine virtuelle Abstraktion gibt – und was passiert, wenn ein Custom Element nie registriert wird. Spoiler: Der Browser bleibt erstaunlich gelassen.
- [00:00:00] Kaputtes HTML & Browser-Parsing
Wir diskutieren, warum Browser kaputtes HTML akzeptieren müssen, weshalb XHTML sich nie durchgesetzt hat und warum ein strikt validierender Browser automatisch ein schlechter Browser wäre.
- [00:00:00] React
isValidElement() Ein eher unbekanntes React-API zur Laufzeitprüfung von React-Elementen. Wir schauen unter die Haube, stolpern über interne Marker wie
$$typeofund landen bei Cross-Realm-Problemen.- [00:46:26] TypeScript
anyvs.unknown Ein zentrales Thema der Folge:
anyals kompletter Opt-out aus dem Typsystem versusunknownals sichere Grenze. Wir erklären Typ-Hierarchien und warumunknownfast immer die bessere Wahl ist.- [00:00:00] TypeScript:
unknownals Sicherheitsgrenze Wir sprechen über reale Einsatzszenarien, etwa bei
fetch(), und warum ein sauberer Typ-Reset oft sinnvoller ist als das blinde Akzeptieren vonany.- [00:48:56] TS-Reset & Fetch-Typen
Ein Community-Projekt, das TypeScript-Defaults bewusst verschärft. Wir diskutieren Chancen, Risiken und warum solche Tools sowohl helfen als auch schaden können.
- [00:00:00] TypeScript Function Overloads
Ein Pattern für robuste APIs: nach außen präzise Typen für gute Autocompletion, nach innen
unknownfür saubere Validierung. Besonders relevant für Library-Autor:innen.- [01:23:42] TypeScript Decorators
Wir sprechen über Legacy-Decorators, Standard-Decorators und warum
"experimentalDecorators"oft mehr Probleme schafft als löst.- [01:33:17]
Symbol.hasInstance&instanceof Ein tiefer Abstecher in Runtime-Typprüfungen, mehrfach gebundelte Klassen und warum
instanceofin größeren Codebases schnell trügerisch wird.