perf(build): split blog assets out of the sitewide bundle #25

Merged

Phil merged 1 commit from chore/frontend-buildchain-baseline into main

2026-08-12 21:02:00 +00:00

Phil commented

2026-08-12 20:55:40 +00:00

Owner

Messwerte

Datei	vorher	nachher
`main.min.css`	125.806	81.897
`main.min.js`	293.164	220.854
`article.min.css`	neu	41.865
`article.min.js`	neu	71.770

Alle Angaben in Bytes. article.min.css und article.min.js werden nur noch auf Artikelseiten geladen. Ersparnis auf der Startseite: 43.909 Bytes CSS und 72.310 Bytes JavaScript.

Warum beide Bundles jetzt als Modul geladen werden

Zwei Einstiegspunkte machen den Build zu einem Code-Splitting-Build, für den Rollup die Formate iife und umd ablehnt. Der dabei ausgelagerte geteilte Chunk wird per import nachgeladen, was in einem klassischen Script ein Syntaxfehler ist und das gesamte Seiten-JavaScript getötet hätte. Sowohl manualChunks: () => null als auch experimentalMinChunkSize wurden gegen den Build geprüft und lösen das nicht, weil Rollup einen von zwei Einstiegspunkten geteilten Chunk nicht zurückdupliziert.

Nebenbefund, der mitrepariert wurde

Der postcss-Verweis in vite.config.js zeigte auf eine Datei, die es im Repo nicht gibt, und die tatsächlich vorhandene Konfiguration hatte eine leere Plugin-Liste. Autoprefixer lief dadurch überhaupt nicht.

Was sonst noch enthalten ist

Die Performance-Baseline unter docs/PERFORMANCE-BASELINE.md, damit das Abnahmekriterium überhaupt prüfbar wird. Dazu ein wiederholbares Skript, das die Testimonial-Schnitte fürs Web kodiert: Wolfgang von 22 MB auf 4,1 MB, Kai von 8,9 MB auf 2,8 MB, jeweils samt AV1-Fassung und Poster. Bewusst als Skript, weil der Look-Durchgang der Videos noch aussteht und dann nur erneut ausgeführt werden muss.

Verifikation

Beide Bundles parsen nachweislich nicht mehr als klassisches Script und sauber als ES-Modul. Der Playwright-Durchlauf über Startseite, Blog-Übersicht und Artikelseite lief ohne Seiten- oder Konsolenfehler, mit bestätigter Interaktion für Sticky-Header, FAQ-Karte, Lightbox und Marginalienspalte. Die Startseite lädt nachweislich keine Artikel-Assets, die Artikelseite alle vier Bundles.

Nicht in diesem PR

Die Ablösung von AOS und das Aufräumen toter Abhängigkeiten sind eigene Vorhaben. Ein bei der Verifikation gefundener Fehler in der Matomo-Einbindung wird getrennt in Issue #24 behandelt.

Closes #22

Die Startseite lud bisher das komplette Blog-Artikel-CSS, die Lightbox und die vier Artikel-Module mit, obwohl nichts davon außerhalb einer Artikelseite gebraucht wird. Ein zweiter Einstiegspunkt trennt das sauber auf. ## Messwerte | Datei | vorher | nachher | | --- | --- | --- | | `main.min.css` | 125.806 | 81.897 | | `main.min.js` | 293.164 | 220.854 | | `article.min.css` | neu | 41.865 | | `article.min.js` | neu | 71.770 | Alle Angaben in Bytes. `article.min.css` und `article.min.js` werden nur noch auf Artikelseiten geladen. Ersparnis auf der Startseite: 43.909 Bytes CSS und 72.310 Bytes JavaScript. ## Warum beide Bundles jetzt als Modul geladen werden Zwei Einstiegspunkte machen den Build zu einem Code-Splitting-Build, für den Rollup die Formate `iife` und `umd` ablehnt. Der dabei ausgelagerte geteilte Chunk wird per `import` nachgeladen, was in einem klassischen Script ein Syntaxfehler ist und das gesamte Seiten-JavaScript getötet hätte. Sowohl `manualChunks: () => null` als auch `experimentalMinChunkSize` wurden gegen den Build geprüft und lösen das nicht, weil Rollup einen von zwei Einstiegspunkten geteilten Chunk nicht zurückdupliziert. ## Nebenbefund, der mitrepariert wurde Der postcss-Verweis in `vite.config.js` zeigte auf eine Datei, die es im Repo nicht gibt, und die tatsächlich vorhandene Konfiguration hatte eine leere Plugin-Liste. Autoprefixer lief dadurch überhaupt nicht. ## Was sonst noch enthalten ist Die Performance-Baseline unter `docs/PERFORMANCE-BASELINE.md`, damit das Abnahmekriterium überhaupt prüfbar wird. Dazu ein wiederholbares Skript, das die Testimonial-Schnitte fürs Web kodiert: Wolfgang von 22 MB auf 4,1 MB, Kai von 8,9 MB auf 2,8 MB, jeweils samt AV1-Fassung und Poster. Bewusst als Skript, weil der Look-Durchgang der Videos noch aussteht und dann nur erneut ausgeführt werden muss. ## Verifikation Beide Bundles parsen nachweislich nicht mehr als klassisches Script und sauber als ES-Modul. Der Playwright-Durchlauf über Startseite, Blog-Übersicht und Artikelseite lief ohne Seiten- oder Konsolenfehler, mit bestätigter Interaktion für Sticky-Header, FAQ-Karte, Lightbox und Marginalienspalte. Die Startseite lädt nachweislich keine Artikel-Assets, die Artikelseite alle vier Bundles. ## Nicht in diesem PR Die Ablösung von AOS und das Aufräumen toter Abhängigkeiten sind eigene Vorhaben. Ein bei der Verifikation gefundener Fehler in der Matomo-Einbindung wird getrennt in Issue #24 behandelt. Closes #22

Phil added 1 commit

2026-08-12 20:55:40 +00:00

perf(build): split blog assets out of the sitewide bundle c6d6fefb83

Die Startseite lud bisher das komplette Blog-Artikel-CSS, die Lightbox und
die vier Article-Module mit, obwohl nichts davon ausserhalb einer
Artikelseite benutzt wird. Ein zweiter Einstiegspunkt trennt das: die
Startseite spart 43.909 Bytes CSS und 72.310 Bytes JavaScript.

Zwei Einstiegspunkte erzwingen ESM-Ausgabe, weil Rollup iife und umd fuer
Code-Splitting-Builds ablehnt. Der dabei ausgelagerte geteilte Chunk wird
per import nachgeladen, was in einem klassischen Script ein Syntaxfehler
ist und das gesamte Seiten-JS getoetet haette. Weder manualChunks noch
experimentalMinChunkSize loesen das, beide wurden gegen den Build geprueft.
Deshalb laufen beide Bundles jetzt als Modul.

Nebenbei repariert: der postcss-Verweis zeigte auf eine Datei, die es nicht
gibt, und die vorhandene Konfiguration hatte eine leere Plugin-Liste.
Autoprefixer lief damit ueberhaupt nicht.

Ausserdem: Baseline dokumentiert, damit das Abnahmekriterium pruefbar wird,
und die Testimonial-Schnitte fuers Web kodiert (Wolfgang von 22 MB auf
4,1 MB, Kai von 8,9 MB auf 2,8 MB, dazu AV1 und Poster) ueber ein
wiederholbares Skript, weil der Look-Durchgang noch aussteht.

Refs #22

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

Phil merged commit 719d25fc20 into main

2026-08-12 21:02:00 +00:00

Phil referenced this pull request from a commit

2026-08-12 21:02:01 +00:00

Merge pull request 'perf(build): split blog assets out of the sitewide bundle' (#25) from chore/frontend-buildchain-baseline into main

Phil referenced this pull request

2026-08-12 21:09:14 +00:00

chore(craft): remove unused boilerplate entry types and fields #28