Revision 694: React- & TypeScript-Glücksrad, mit Hans-Christian Otto

Working Draft

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

useDebugValue ist 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 $$typeof und landen bei Cross-Realm-Problemen.

[00:46:26] TypeScript any vs. unknown

Ein zentrales Thema der Folge: any als kompletter Opt-out aus dem Typsystem versus unknown als sichere Grenze. Wir erklären Typ-Hierarchien und warum unknown fast immer die bessere Wahl ist.

[00:00:00] TypeScript: unknown als Sicherheitsgrenze

Wir sprechen über reale Einsatzszenarien, etwa bei fetch(), und warum ein sauberer Typ-Reset oft sinnvoller ist als das blinde Akzeptieren von any.

[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 unknown fü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 instanceof in größeren Codebases schnell trügerisch wird.