Jekyll - Generator für statische Websites

Was ist ein „Static Site Generator“, wie kam es dazu und warum ein Umstieg auf diese Technik auch für Sie Sinn machen könnte - all das soll in diesem Artikel beleuchtet werden.

Jekyll Logo

In den Anfangstagen des Internets war die Menge an Inhalten auf Websites recht überschaubar und eine Verwaltung der Inhalte konnte leicht von Hand vorgenommen werden. Mit der Zeit aber wuchsen die Anzahl der Dateien, und man verlor den Überblick bei der Verwaltung dieser Inhalte, also suchte man nach Lösungen, die großen Mengen der einzelnen Dateien effizienter zu verwalten und sich von dem repetiven Prozess der Webseitenerstellung zu lösen. Die Lösung waren serverseitige Systeme, welche Programmiercodes ausführt, welche wiederum die Inhalte mit vordefinierten Vorlagen zusammenführten. Auf Anfrage lieferte der Webserver dann die so erstellten Websites an die Benutzer aus. Voila, die dynamische Website war geboren.

Statische Site-Generatoren (SSG) machen im Prinzip dasselbe: Sie führen Dateien und Inhalte mit Vorlagen zusammen und generieren eine HTML Ansicht, die dann auf einen Webserver geladen und von diesem ausgeliefert werden kann. Der wesentliche Unterschied aber zwischen einem statischen Seitengenerator und einer traditionellen Webapplikation ist, dass diese Webseiten vorab generiert werden, anstatt auf eine Anforderung zu warten und diese erst dann zu generieren.

Geduld ist des Menschen Stärke nicht und von daher ist die Ladezeit ein wesentlicher Faktor für den Erfolg einer Website. Mit statischen Site-Generatoren wird die “build time”, also die Erstellungszeit, aus der “request time”, also Anfragezeit, eliminiert. Die statische Seite lädt viel schneller und es braucht weniger Ressourcen um die Website bereitzustellen - ein immenser Vorteil.

Tom Preston-Werner, der Erfinder von Jeykll
Tom Preston-Werner, der Erfinder von Jeykll
TimBray, CC BY-SA 3.0, via Wikimedia Commons

Tom Preston-Werner - der Erschaffer von Jekyll

Ich weiß nicht mehr wann ich das erste Mal von einem statischen Seitegenerator Notiz genommen habe, aber ich weiß noch dass es Jekyll1 war. Projekte wie Hugo2 erfreuen sich zwar wachsender Beliebtheit und haben lt. Angaben auf Jamstack3 Jekyll im Ranking längst überholt. Trotzdem ist Jekyll für mich nach wie vor die bessere Lösung - wohl auch deshalb, weil mir die Programmiersprache Ruby mehr liegt als Go.

Es gab auch wohl vorher schon vergleichbare Lösungen4, als am 17. November 2008 der Github-Gründer Tom Preston-Werner auf seinem Blog5 Jekyll das erste Mal vorstellte und die Funktionsweise erklärte. Statische Site-Generatoren sind also nicht mehr ganz so neu, aber Jekyll sorgte dafür, dass sie im (Entwickler-)Mainstream ankamen.

Wie man eine Website mit Jekyll baut.

Zuerst muss man sich Ruby installieren6 und nach der Eingabe von 4 Befehlen auf der Kommandozeile kann es auch schon losgehen. Auf der Jekyll Website gibt es eine Anleitung, wie man in Sekunden einen Blog baut:

Jekyll Quickstart
Jekyll Quickstart (Screenshot: https://jekyllrb.com/)

Voila, das wars - jetzt kann man die voll funktionsfähige Website im Browser unter http://localhost:4000 aufrufen. Man müsste jetzt nur noch seine Inhalte einpflegen und die generierten Dateien mit einem FTP Programm auf den Host laden - und schon wäre man damit online.

Für Jekyll gibt es viele fertige, einfach zu installierende Themes. Wie man diese installiert und wie man seine Inhalte verwaltet ist alles gut auf der Jekyll Website dokumentiert7, von daher spare ich mir das hier.

Ersatz für Wordpress?

Auf manchen Webseiten wird Jekyll als Alternative zu Wordpress angepriesen. Technisch gesehen stimmt das sicher, man kann mit Jekyll dieselben Blogs bauen wie mit Wordpress. Jedoch sehe ich das Problem eher beim Anwender - denn der Trend geht eher hin zu DIY Baukästen-Abos, wo z.B. ein Handwerker ohne Programmierkenntnisse auch seine Website zusammenschustern kann. Ich kann mir schwer vorstellen dass so jemand seine Inhalte in Markdown Dateien verwaltet oder über Liquid-Includes Codefragmente einbindet. Für die meisten Benutzer ohne Programmierkenntnisse dürfte Jekyll wohl keine Alternative zu Wordpress sein, aber ich kann mich auch irren. Mit ein wenig guten Willen und einer Anleitung würde wohl auch der Handwerker seine Inhalte ins Netz bekommen.

„Blogging Like a Hacker” war der Titel des Artikels, in dem Tom Preston-Werner Jekyll vorstellte - es war also von Anfang an als Werkzeug für Entwickler gedacht und weniger für den Anwender. Und ja, es gibt Versuche Jekyll für eben diese benutzerfreundlicher zu machen (z.B. „Jekyll Admin“, siehe Screenshot), aber man sollte trotzdem zumindest die Auszeichnungssprache Markdown8 beherrschen. Wysiwyg („What you see is what you get“) ist nicht vorgesehen bei Jekyll.

Jekyll Admin
Jekyll Admin ist ein Jekyll Plugin und der Versuch eine benutzerfreundliche, grafische Oberfläche für Jekyll bereitzustellen

Fazit: Für wen ist Jekyll jetzt das Richtige?

Für Hacker, Nerds und Freaks. 🤭 Nein, Scherz beiseite. 🤣

Jekyll kann grundsätzlich für jeden interessant sein, der sich gerne weiterbildet und es liebt mit einfachen Mitteln wie Text-Editoren zu arbeiten. Es ist ideal für Entwickler die schnell mit einfachen Mitteln eine Website bauen möchten.

Für jemanden der ohnehin die Inhalte seiner Website nicht selbst pflegen will und jedenfalls jemanden beauftragen wird, ist Jekyll das beste und günstigste System. Jekyll schlägt in Sachen Performance und Kosten alle dynamischen Systeme um Längen. Inhalte sind viel schneller eingepflegt und Anpassungen schneller durchgeführt. Und es gibt keine Systemwartungskosten - ein Punkt der immer wieder gerne übersehen wird, denn „normale“ Content Mangement Systeme brauchen auf jeden Fall regelmäßige Updates.

  1. Jekyll 

  2. gohugo.io ist die Website des Hugo Projekts. 

  3. Jamstack, eine Website über die Webentwicklungsarchitektur „Jamstack“. JAM steht dabei für JavaScript, API und Markup durch einen Statischen Site-Generator. 

  4. The ‘Before Jekyll’ era ist ein interessanter Blogeintrag über die Zeit vor Jekyll. 

  5. Blogging Like a Hacker von Tom Preston-Werner, dem Gründer von Github. 

  6. Installing Ruby: Hier wird genau erklärt, wie man Ruby auf seinem Rechner installieren kann. 

  7. Jekyll Dokumentation 

  8. Markdown ist eine vereinfachte Auszeichungssprache. 

Passt zum Thema: