Andere Wege zu SPAs

Das reimte sich lolz.

Ich erwähnte in einem Podcast neulich, dass ich irgendwie denke, WordPress sollte mit Turbolinks ausgeliefert werden. Es ist eine ziemlich einfache Prämisse

1. Erstelle eine serverseitig gerenderte Website.
2. Turbolinks fängt Klicks auf Links derselben Herkunft ab.
3. Es verwendet AJAX für den HTML der neuen Seite und ersetzt die aktuelle Seite durch die neue.

Mit anderen Worten, eine serverseitig gerenderte Anwendung wird durch Hinzufügen dieser Bibliothek zu einer "Single Page App" (SPA) gemacht.

Warum sich die Mühe machen? Es kann ein wenig schneller sein. Vollständige Seitenaktualisierungen können sich im Vergleich zu einer SPA langsam anfühlen. Turbolinks ist eine Art "alte" Technologie, aber sie ist immer noch vollkommen nützlich. Tatsächlich hat Starr Horne kürzlich einen großartigen Blogbeitrag über die Migration zu ihr bei Honeybadger geschrieben.

Honeybadger ist keine Single Page App und wird es wahrscheinlich auch nie sein. SPAs ergeben für unsere technischen Anforderungen einfach keinen Sinn. Schauen Sie sich das an:

• Unsere Anwendung zeigt hauptsächlich Seiten mit statischen Informationen an.
• Wir verarbeiten viele Daten, um eine einzelne Fehlerberichtseite zu generieren.
• Wir haben ein sehr kleines Team von vier Entwicklern und möchten daher unsere Codebasis so klein und einfach wie möglich halten.

… Es gibt einen Ansatz, den wir seit Jahren verwenden und der es uns ermöglicht, alles zu haben und zu genießen … und seine große Idee ist, dass Sie SPA-ähnliche Geschwindigkeit ohne all das JavaScript erzielen können.

Das meine ich mit WordPress. Es ist sehr gut, dass es standardmäßig serverseitig gerendert wird, aber es könnte auch von SPA-Funktionen mit einem einfachen Ansatz wie Turbolinks profitieren. Sie können es sich jedoch immer selbst hinzufügen.

Nur Ihre serverseitig gerenderte Website zu verlassen, ist keine schlimme Sache. Wenn Sie die Seiten leicht halten und die Ressourcen zwischenspeichern, sind Sie wahrscheinlich in Ordnung.

Chrome hat einige neue Ideen entwickelt

• „Paint Holding“ reduziert den weißen Blitz zwischen Seitenaufrufen.
• Das „Portal“-Element hilft beim Übergang von Seite zu Seite ohne Neuladen. Beachten Sie die Barrierefreiheitsprobleme.

Ich zweifle nicht daran, dass dieses serverseitig gerenderte, aber in eine SPA integrierte Vorgehen dazu beigetragen hat, Ansätze wie Next und Gatsby zu popularisieren.

Ich möchte die Kraft eines "echten" SPA-Ansatzes nicht schmälern. Das Netzwerk ist der Hauptgrund für langsame Websites. Wenn eine Anwendung also so konzipiert ist, dass sie relativ winzige Datenpakete (anstelle von relativ schweren, großen HTML-Blöcken) versendet und dann berechnet, wie klein der DOM-Teil ist, der neu gerendert werden kann und dies tut, dann ist das ziemlich großartig. Nun ja, bis der Flaschenhals JavaScript selbst wird.

Es ist nur bedauerlich, dass ein SPA-Ansatz oft auf Kosten keinerlei serverseitiger Wiedergabe erfolgt. Und ebenso bedauerlich ist, dass die Kosten für die "Hydrierung" einer serverseitig gerenderten Anwendung zu einer SPA auf Kosten der Bindung des Hauptthreads an JavaScript gehen.

Verdammt, wenn man es tut. Verdammt, wenn man es nicht tut.

Glücklicherweise gibt es ein Spektrum an Wiedergabemöglichkeiten, um eine geeignete Architektur auszuwählen.