Reduzieren Sie die Anzahl der DOM-Knoten

[Rolf B]

Hallo bornstecker,

infinite scroll ist eine hässliche Sache, weil man dann nämlich keine Links in den Footer setzen sollte (so böse Dinger wie Kontakt und Impressum; wenn man da nicht rankommt winkt der Abmahnteufel). Ich habe selbst noch keins gebaut und kann darum auch keine Tipps geben, wie es geht. Aber das Web ist sicher voll davon.

Was für die Verfügbarkeit der Footer-Links hilft, ist ein 100vw/100vh Seitenrahmen, aus Header, Hauptbereich und Footer. Nur der Hauptbereich ist scrollbar, und der Footer immer vorhanden, trotz Infinite Scroll. Nachteil: Ständig verringerter Bildschirmplatz, d.h. der Footer muss sehr klein bleiben. Und ob Dein CMS das hergibt ist natürlich erst noch die Frage.

Was Dir nicht hilft, ist das Abspecken von CSS. Weil - das misst dein QA-Tool gar nicht. Du hast allerdings 6 CSS Dateien, die alle geladen werden müssen. Sind sie im Cache, ist's nicht so schlimm, beim ersten Laden sind das aber 6 Webrequests die abzusetzen sind. Eine Minifizierung ist nicht unbedingt nötig, weil Du eh gzip schickst, aber Bundling zu einer CSS Datei kann helfen. Dafür gibt's Tools, meistens auf node.js basierend, die man einmal laufen lässt und dann die Dateien zu einer zusammenfügen (z.B. SASS oder LESS). Diese Tools können noch viel mehr, aber Bundling ist eins ihrer Features. Wobei man beim Bundling aufpassen muss, bündelt man zu stark, stehen die ersten Styles erst zur Verfügung wenn der letzte ausgepackt ist und die Seite zuckt beim Laden 'rum. Die wichtigsten Styles, die "above the fold" Styles, muss man ggf. separat laden. Aber 2 CSS Dateien sind auf jeden Fall besser als 6.

Sodann lädst Du jede Menge Bilder (PNG und SVG). Ein paar PNGs hast Du schon zu einem Spritesheet zusammengefasst, sehr gut. Vielleicht geht da noch mehr. Auch SVGs kann man zu Sprites zusammenfassen. Das kann die Ladezeit beschleunigen.

Die ganzen Google-Sachen sind vom Laden her recht teuer. Das Download-Volumen der Seite wächst von gut 200K auf über 700K, es finden 70 Webrequests statt 30 statt und es vergehen 2,2s statt 0,7s, bis die Seite komplett geladen ist. Die längere Zeit ist aber nicht so schlimm, weil ein großer Teil davon passiert nachdem die Seite sichtbar und benutzbar ist. Ich glaube, das kannst Du nicht ändern (weil Du die Werbung ja drin lassen willst).

Das JSON LD ist schon ein Batzen. Den Nutzen kann ich nicht beurteilen, ich schreibe Intranet-Webseiten, die Google nicht zu sehen bekommt. Du könntest es ggf. ans Ende der Seite stellen, damit die Seite schon mal sichtbar ist, während der Browser noch daran ruminterpretiert.

Dieses AddToCalendar Gedöne ist allerdings ein Klops. Jeder Datenblock doppelt und einiges an HTML pro Termin. Kennt das Tool keine elegantere Möglichkeit, das zu steuern?

Rolf