Inertia

Ich mochte schon immer Jeremys Kategorisierung von Entwicklerwerkzeugen

Ich habe zwei Kategorien von Werkzeugen für die Webentwicklung erwähnt. Ich weiß immer noch nicht genau, wie ich diese Kategorien nennen soll. Intern und extern? Entwicklerzentriert und benutzerzentriert?

Die erste Kategorie umfasst Dinge wie Build-Tools, Versionskontrolle, Transpiler, Präprozessoren und Linter. Dies sind Werkzeuge, die auf Ihrem Rechner – oder auf dem Server – laufen und das, was Sie geschrieben haben, in die Rohmaterialien des Webs verwandeln: HTML, CSS und JavaScript.

Die zweite Kategorie von Werkzeugen sind diejenigen, die aus den Rohmaterialien des Webs bestehen: CSS-Frameworks und JavaScript-Bibliotheken.

Das ist eine gute Art, über Dinge nachzudenken. Es gibt natürlich auch Nuancen. Sass gehört zur ersten Kategorie, da Sass niemals zu den Benutzern gelangt, sondern nur CSS erstellt, das zu den Benutzern gelangt. Es kann die Benutzer aber trotzdem beeinflussen, da es je nach Verwendung größere oder kleinere CSS-Dateien erstellen kann.

Jeremy erwähnt Svelte als eine Bibliothek, deren Ziel es im Wesentlichen ist, so viel wie möglich von sich selbst zu kompilieren, bevor der Code an die Benutzer geht. Es ist immer noch etwas JavaScript vorhanden, aber es enthält nicht den Overhead einer entwicklerorientierten API. Die Nuance hierbei ist, dass Svelte so verwendet werden kann, dass jegliches JavaScript vollständig entfernt wird. SvelteKit kann beispielsweise seine Hydration vollständig ausschalten und Seiten vorrendern, wodurch eine Website vollständig JavaScript-frei wird (oder zumindest nur dort JavaScript hinzugefügt wird, wo Sie es explizit wünschen).

Über React

Ich weiß, dass es Wege gibt, React mehr wie ein Werkzeug der ersten Kategorie zu verhalten, aber das ist definitiv nicht das Standardverhalten. Und das Standardverhalten ist wirklich, wirklich wichtig. Bei React geht man standardmäßig davon aus, dass der gesamte Code, den Sie schreiben – und das Werkzeug, das Sie zum Schreiben verwenden – an die Endbenutzer übermittelt wird.

Ich denke, das ist fair zu sagen, aber es scheint auch, als würde sich die Geschichte langsam zu ändern beginnen. Ich glaube, die breite Nutzung ist noch weit entfernt, aber Server Components scheinen hier bemerkenswert zu sein, da sie vom React-Team selbst kommen, genau wie SvelteKit vom Svelte-Team selbst kommt.

Und zu Astro

[…] Im Gegensatz zu Svelte ermöglicht Astro die Verwendung der gleichen Syntax wie der Vorgänger, React. Wenn Sie also React gelernt haben – weil Sie es gelernt haben mussten, um einen Job zu bekommen – müssen Sie keine neue Syntax lernen, um Astro zu verwenden.

Ich weiß, dass man wahrscheinlich keine bestehende React-Website mit einem Schalter in Astro umwandeln kann, aber zumindest gibt es einen klaren Upgrade-Pfad.

Das ist nicht nur theoretisch wahr, sondern nachweislich wahr!

Ich habe gerade unsere kleine serverlose Microsite von Gatsby zu Astro konvertiert. Gatsby basiert auf React, daher sind alle Komponenten bereits als React-Komponenten aufgebaut. Der Pull Request ist unübersichtlich, aber er ist da. Ich habe einige davon in .astro-Dateien umgewandelt, aber einen Großteil der Komponenten weitgehend unverändert als .jsx React-Komponenten belassen. Aber React wird nicht auf die Website für Benutzer geliefert. JavaScript ist fast vollständig von der Website entfernt, abgesehen von einigen handgeschriebenen Vanilla-JavaScript für sehr leichte Interaktivität.

Es gibt hier also einige Zufallseffekte. Münzverschmelzung? Astro fühlt sich für mich sehr wie ein entwicklerorientiertes Werkzeug an. Es hilft mir. Es verwendet den Vite-Compiler und ist super schnell und angenehm zu verwenden (Astro hat sicher noch Ecken und Kanten, da es vor 1.0 ist, aber das DX ist größtenteils vorhanden). Es skaliert meine Stile. Es lässt mich SCSS schreiben. Es lässt mich Komponenten schreiben (in vielen verschiedenen Frameworks). Aber es hilft auch dem Benutzer. Kein JavaScript-Bundle mehr auf der Website überhaupt.

Ich denke, das bedeutet, dass Astro die Kategorien nicht verändert – es ist ein entwicklerorientiertes Werkzeug. Es wandelt nur das, was ein benutzerorientiertes Werkzeug wäre (selbst Svelte), in etwas fast ausschließlich entwicklerorientiertes um.

---

Und nur weil ich noch ein paar andere Astro-Links hatte, die ein Loch in meiner Tasche brannten, hat Flavio ein gutes Einführungs-Tutorial und hier unterhalten sich Drew McLellan und Matthew Phillips über Astro in einem aktuellen Smashing Podcast.

---

Und hier unterhalten sich Dave und ich über meine kürzliche kleine Website-Überarbeitung in Astro