In mein­er Präsen­ta­tion wer­den wir uns auf eine Reise durch fünf Antipat­tern begeben, die unsere React/GraphQL App aus­ge­bremst haben. Jed­er Abschnitt beleuchtet einen bes­timmten Fehler, die damit ver­bun­de­nen Schwierigkeit­en und wie wir diese schließlich meis­tern konnten.

Struk­tur und Inhaltsverzeichnis:

• Over-fetch­ing Data: Ich zeige auf, wie Over-fetch­ing — das Anfordern von mehr Dat­en als notwendig — eine App ausbremst.
• Under-fetch­ing und Mul­ti­ple Round Trips: Ich gehe auf das The­ma Under-fetch­ing ein, bei dem wir zu wenig Dat­en ange­fordert haben und mehrfache Requests. Dabei zeige ich, wie wir durch das präzise Definieren unser­er Date­nan­forderun­gen in unseren Abfra­gen mehrfache Server­an­fra­gen ver­mei­den konnten.
• Zweck­ent­frem­dung von GraphQL-Sub­scrip­tions: Ich zeige auf, wie der unsachgemäße Gebrauch von GraphQL-Sub­scrip­tions zu ein­er Flut unnötiger Dat­en geführt hat.
• Über­mäßige Ver­wen­dung von GraphQL-Frag­menten: Ich bew­erte den Effekt der über­mäßi­gen Nutzung von GraphQL-Frag­menten und zeige auf, wie ein durch­dacht­es Design das Frag­ment Over-fetch­ing ver­hin­dern konnte.
• Fehlen von Opti­mistic UI-Updates: Ich beschreibe, wie durch die Imple­men­tierung von Opti­mistic UI-Updates die Reak­tion­szeit der UI verbessern konnten.