Revision 552: Frontend Development im Jahr 2023

Working Draft

Zum Jahreswechsel haben wir uns mit Joe Ray Gregory (@joyraygregory) hingesetzt und zusammen darüber orakelt, welche neuen Tools und Paradigmen die Frontend Entwicklung im Jahr 2023 prägen könnten. Joe ist Frontend-Entwickler und Trainer aus Hamburg und Ihr kennt ihn vielleicht aus der Revision 520 über Unit-Testing.

---

Unser Sponsor

Workshops.DE bietet IT-Schulungen für moderne Web-Entwicklung. Dabei arbeitet Workshops.DE nicht als reiner Vermittler, sondern bildet eine Community aus über 80 Trainer:innen, welche gemeinsam Material erstellen, sich gegenseitig unterstützen und weiterbilden, um möglichst nachhaltige und hochqualitative Weiterbildungsangebote zu schaffen.

Ein starker Fokus liegt hierbei auf den Frontend-Frameworks Angular, React und Vue. Neben diesen gibt es aber auch Weiterbildungen im Bereich Docker, Kubernetes und Spring Boot. Zum Netzwerk gehören ebenfalls die Community-Portale Angular.DE, ReactJS.DE und VueJS.DE.

Seid ihr auf der Suche nach einer qualitativen Weiterbildung im Bereich Web-Entwicklung oder möchtet euch selbst als Trainer:in einbringen? Dann seid ihr bei Workshops.DE genau richtig.

---

Schaunotizen

[00:01:45] Frontend Development im Jahr 2023

Wir reden natürlich über Frontend-Frameworks und denken, dass der Schwenk hin zu Frameworks fortsetzen wird, bei denen Server-Side-Rendering und so wenig JaVaScript im Client der Standard ist. Prominentestes Beispiel hierfür ist Astro, aber auch NextJS und NuxtJS entwickeln sich in diese Richtung.

Außerdem werden sich Web Components als Auslieferungsform weiter etablieren.

Für eine bessere Performance wird alles weiter in Richtung „Actor Model“ entwickelt, also dass ein Main-Thread möglichst viel Arbeit in separate Threads auslagert (höre auch Revision 329 zum Actor Model). Eine Schlüsselrolle wird das Tool Partytown spielen.

Als Unterstützung bei der Entwicklung werden Mikro-Bibliotheken aus dem UnJS-Pool große gebräuchliche Bibliotheken wie Axios oder auch Lodash ersetzen.

Im Testing wird Playwright seinen Marktanteil weiterausbauen.

Für die Komponenten-basierte Entwicklung wird Storybook zwar das Goto-Werkzeug bleiben, aber daneben wird sich Histoire aus dem Vue-Umfeld ähnlich etablieren können wie zuvor auch schon Vite.

In Sachen Bundler und Build-Tools kommt allerlei Neues auf uns zu: Turbopack wird der Nachfolger von Webpack und dann gibt es vom Erfinder von Babel noch eine ganze Build-Suite namens Rome, die Code-Formattier, Code-Linter, Com- & Transpiler, Bundler, sowie das Testing-Tool aus einer Hand sein will. Beiden ist gemeinsam, dass sie aus Performance-Gründen auf Rust bauen, was derzeit auch im Trend zu sein scheint und von SWC, Parcels Lightning CSS und esbuild (allerdings in Go) vorexerziert wurde. Darüber, ob das immer nötig ist oder ob ein wenig Nacharbeit an JavaScript-Code nicht der erste Zwischenstopp sein müsste, fragt sich da Marvin Hagemeister.

Aus dem CSS-Bereich kommend werden die Container Queries ganz viel neue Möglichkeiten eröffnen, sobald diese in allen Browsern freigeschaltet sind.

Monorepos werden ein Thema werden, dank exzellentem Tool-Support durch pnpm, Turborepo oder Lerna (das allerdings nicht mehr maintained wird).

Und schließlich schauen wir auch gespannt darauf, was der NodeJS- und Deno-Konkurrent Bun, dessen JavaScript-Engine nicht auf Googles V8, sondern auf Apple JavaScriptCore bsisert, zukünftig in die Waagschalde werfen wird.

[00:00:00] Keine Schaunotizen

Console Ninja

VSCode-Erweiterung, um Consolen-Output direkt in der IDE zu haben.