criticalCSS automatisch berechnen und ausgeben (Enhancement)

[akuehnis]

Enhancement: Folgendes Konzept würde Google Insight noch glücklicher machen (habe das bei einem Shop umgesetzt mit gutem Erfolg):

1. Wenn Seite vollständig geladen, CSS-Rules für "Above the Fold" bestimmen
2. Das gefundene Regel-Set per Ajax zurück schreiben und speichern
3. Beim nächsten Seitenaufruf das CSS inline in den Head einfügen, dafür alle CSS hinter den schliessenden html-Tag

Erfassung des critical-CSS

• Pro Article-ID, clang_id und isMobile true/false
• nur einmal und dann am besten mit einem Security Code (sonst könnte man von aussen beliebigen CSS-Code übergeben)
• criticalCSS muss auch manuell ergänzt werden können
• criticalCSS sollte im Cache gespeichert sein und per "Cache leeren" erneuert werden können

Brauchbare Funktionen hierzu:

• https://gist.github.com/scottjehl/b6129da04733e4e0f9a4
• https://github.com/PrestaShop/PrestaShop/blob/develop/tools/mobile_Detect/Mobile_Detect.php

Die Funktion passt irgendwie ins Minify-Addon.

[alxndr-w]

Meinung: Google Page Speed Insights-Optimierung kann ein Fass ohne Boden sein. Ich stimme dir zu, dass die automatische Generierung von critical css günstig wäre. Aber minify soll ja vom Namen her alles kleinmachen, was es in die Finger bekommt - die Berechnung des critical css, sofern es automatisch geschehen soll, könnte auch außerhalb von minify erfolgen.

[akuehnis]

Ja, ich denke du hast recht. In Minify ist das wohl am falschen Ort. Insbesondere wird diese Funktion ja wohl nicht benötigt für eine Webseite, die mit http/2 läuft. Ich mache mal ein separates Addon, das kann man dann weglassen oder nicht, wie man will.