Eine Webseite, Drei Frameworks / JAMstack

Wir haben uns mal die Mühe gemacht und diese Page palmomedia.de in den Drei beliebtesten Frontend-Frameworks Vue.js, React,js und Angular “neu”gebaut.

Was dabei passierte…

Vue.js

Den Anfang macht Vue.js — hier das Repo https://gitlab.com/palmomedia/version-vuejs
Dieser Post hier ist nun initial zu sehen. Ich schreibe noch ein paar mehr, da ich ein paar kleine Tips teilen möchte aber vor allem da es doch alles länger dauert als geplant und ich sonst den Überblick verliere. Also vor knapp einer Woche habe ich angefangen mit Vue. Schön schlank. Das CMS habe ich direkt eingebunden bekommen. HelloWorld war auch okay und dann kommen Fallstrick1 (.htaccess) und Fallstrick2 (mal eben schnell Transitions). Aber alles in allem ging es flott und nach nur 3 Nachtssessions und viel Kaffee habe ich eine passable “einfache” Blogpage auf die Beine gestellt.

PageSpeed Insights — Google Developers

Ich mache das um später alle Drei Exemplare durch die Google Tools zu jagen. Rendering ist ja heute ein recht großes Thema und daher will ich mal vergleichen unter der Annahme, dass ich alle Drei Seiten exakt gleich baue — also Styling mit Bootstrap und der Content kommt über die Wordpress API — welches Framework den besten Score absahnt.

Hier jetzt mal der aktuelle Stand der https://vuejs.palmomedia.de/ Variante. Das ist noch nicht ganz fair. Da ich auf jeden Fall noch leicht basteln werde.

Google: https://bit.ly/3bkww9N

Aber im Grunde kann man schon mal abzeichnen, dass die mobile Variante ohne Lazy-Loading nicht ganz so top ist wohingegen die Desktop Variante unoptimiert schon einiges bietet.

Also, weiter gehet es mit reacts.js — (Update hier geht es zum Post: Eine Webseite, Drei Frameworks — Part react.js / JAMstack)