Static-Site-Generator – was ist das überhaupt?
Eine Website besteht aus HTML und CSS. Dynamische Inhalte kommen über JavaScript hinzu. Für eine Firmenwebsite wie unsere braucht man normalerweise nicht so viel, was fliegt, pufft und explodiert. Das lenkt mehr ab, als dass es hilft. Der Fokus liegt also auf den Inhalten – und dafür benötigen wir hauptsächlich HTML und CSS.
Das sieht in etwa so aus:
<section class="side">
<h2>ÜBER UNS</h2>
<p>Wer sind die Menschen hinter Vitamin P. Warum schlägt unser Herz so für gute Softwareentwicklung?
...
</section>
Das ist ziemlich mühsam von Hand zu tippen, vor allem weil man die Teile der Seite, die überall vorkommen, dann so oft wiederholen müsste, wie es Seiten gibt.
Deswegen gibt es Systeme, die das Tippen und das Management von sich wiederholenden Teilen der Seite vereinfachen. Das sind sogenannte Content Management Systeme. Hier wird einfach in ein Textfeld eingetippt und schon erscheint der Text in dem Rahmen, den der Designer vorgegeben hat, auf der Seite.
Leider ist es aber so, dass diese CMS Systeme eine Seite für jede Anfrage an den Server immer neu zusammenbaut. Das kostet Rechenleistung auf dem Server und auch Geschwindigkeit für den Nutzer.
Deswegen etablieren sich seit einigen Jahren die Static Site Generator immer mehr. Diese bauen die Seite einmal zusammen, legen Sie dann auf dem Server ab und jeder Nutzer der Seite bekommt dann diese zusammengebaute Seite ausgeliefert.
Aber was ist, wenn sich etwas auf der Seite ändert? Ein CMS kann diese Änderung normalerweise direkt bei der nächsten Anfrage an den Nutzer der Seite weitergeben. Ein Site-Generator muss dafür eine neue Variante der Seite bauen.
Warum ein Static Site Generator
Damit kommen wir zu den Vor- und Nachteilen von CMS vs. Site Generators.
CMS spielen immer da ihre Stärke aus, wo Inhalte sich häufig ändern und es eventuell auch komplexere Autoren-Abläufe gibt. Site Generators sind immer dann super, wenn wir wenig Änderungen und wenig Dynamik auf der Seite haben.
Und zugegebenermaßen kommt hier bei uns höchstens mal ein neuer Blog-Eintrag hinzu, weswegen wir uns dazu entschieden haben, unsere Seite mit Hugo zu bauen. Dabei handelt es sich um einen in Go geschriebenen, sehr schnellen und verbreiteten Generator, der alle Features, die wir benötigen mitbringt: Blog-Unterstützung, Templates, Mehrsprachigkeit …
Der Vollständigkeit halber, muss hier noch erwähnt werden, dass es vollkommen klar ist, dass man mit Site Generators auch sehr dynamische Seiten (mit Gatsby, next.js, usw. - mehr Informationen auf Jamstack) mit komplexen Workflows bauen kann und mit den meisten CMS und einem sinnvollen Cache auch sehr schnelle und ressourceneffiziente Seiten.
Wie funktioniert das jetzt?
Wir haben uns ein HTML-Template geschrieben, so wie man das auch bei einem CMS machen würde. Darin gibt es Platzhalter für die Inhalte, die wir pflegen.
Diese schreiben wir zumeist einfach als Markdown Datei, die wir in ein Repository bei Gitlab hochladen. Netlify, ein Dienst zum Hosting von statischen Webseiten, checkt unser Repository aus und Hugo baut dann die Inhalte in das Template ein, setzt die Links zwischen den Dokumenten richtig und erzeugt das entsprechende HTML. Dieses liegt dann bei Netlify auf dem Server und wird an unsere Leser ausgeliefert.
Wir sind sehr glücklich mit der Lösung. Als Hauptzeit-Entwickler fühlen wir uns im Code-Editor ohnehin wohl und mit einem Push auf dem Main Branch ist unsere Website aktualisiert.
