Die Tage statischer Webseiten sind gezählt – konnte man lange Zeit meinen. Statische Webseiten, das sind HTML-Dateien, die auf einem Server liegen und deren Inhalte sich nicht verändern. Egal um welche Zeit ein Nutzer die URL einer Seite aufruft – das Ergebnis für sie oder ihn wird immer dasselbe sein.
Der Großteil des Webs besteht heutzutage jedoch aus aktuellen, sich dynamisch verändernden Inhalten. Dynamische Webseiten werden beim Aufruf on-the-fly erzeugt, oft unter Einbeziehung aktueller Daten aus Datenbanken. Mehr als 60% aller Websites im Internet nutzen Content-Management-Systeme (CMS), die auf ebendiese Art Inhalte bereitstellen. Hinzu kommen Single-Page-Applications, in denen JavaScript im Browser den Ton angibt. Auch hier findet sich ein Großteil dynamischer Inhalte, die sich abhängig von Benutzerinteraktionen verändern.
Performance und Sichtbarkeit
Doch das Revival statischer Webseiten ließ nicht ewig auf sich warten. Die neuen (alten) Anforderungen an moderne Webseiten heißen Performance für eine optimale User Experience sowie SEO (Suchmaschinenoptimierung) für eine optimale Auffindbarkeit in den Tiefen des Web. In beiden Fällen spielen statische Webseiten ihre Stärken aus. Die Crawler der Suchmaschinen haben mit ihnen leichtes Spiel, und dadurch, dass sie nicht erst generiert werden müssen, stehen sie blitzschnell zum Abruf bereit. Hinzu kommen geringere Infrastruktur-Abhängigkeiten beispielsweise von Applikationsservern oder Datenbanken sowie eine verringerte Angriffsfläche für bösartige Attacken.
Lösungen von Eleventy bis VuePress
In Zeiten, in denen interaktive Webseiten zunehmend als moderne JavaScript-basierte Single-Page-Applications implementiert werden, stellte sich daher die Frage, wie statische Ansätze hier zukunftsweisend integriert werden können. Die Antwort sind statische Seitengeneratoren wie Nuxt.js und VuePress (für das JS-Framework Vue), Scully (für Angular) sowie Gatsby oder Next.js (für die JS-Library React). Weitere populäre Ansätze sind Hugo, Jekyll oder Eleventy. Der zugehörige Architekturansatz wird häufig auch als Jamstack beschrieben.
Doch wie sieht ein solcher Ansatz und die dazugehörige Vorgehensweise nun konkret aus? Gegeben sei ein Blog wie dieser, basierend auf dem weltweit meistgenutzten Content-Management-System WordPress.
WordPress: Vom Seitengenerator zum Datenlieferant
Oliver Hagel und Simon Schwegler haben in ihrer Projektarbeit untersucht, wie sich die Seitenperformance mittels des statischen Seitengenerators GatsbyJS steigern lässt und zu welchem Preis, d.h. Aufwand, dies geschehen kann. Dabei thematisieren sie den veränderten Entwicklungsprozess ebenso wie die Limitierungen, die dieser Ansatz mitsich bringt. Die Arbeit ist unter folgendem Link abrufbar.
Kommentare von hofmeister