CSS-Datei on the fly erstellen

[EnsembleUn]

Gerade bin ich dabei einen Kundenshop mit Google Pagespeed ein wenig zu "tunen". Mittlerweile tummele ich mich im 90'er Bereich, aber es geht eben noch mehr.
Was bisher noch angekreidet wird, dass sehr viel CSS auf der jeweils aufgerufenen Seite nicht benötigt wird. Klingt auch logisch, denn was will ich mit CSS, was erst im Produktlisting gebraucht wird,
auf der Startseite.

Hat sich mal jemand Gedanken gemacht, ob es zu realisieren wäre eine CSS-Datei on the fly zu erstellen? Sprich ein Skript liest alle Klassen und ID aus der generierten HTML-Datei und erstellt anhand dieser
Liste die "verschlankte" CSS-Datei.

Gruß
Ronny

[Doc Olson]

Klingt nach nem ziemlich sinnfreien Ansatz.

1. "On the fly" bedeutet Performance-Verlust.
2. Könnte man cachen, aber das bedeutet im Endeffekt auch, dass ein Shop insgesamt sehr viel mehr CSS Dateien hat. Auf jeder Seite eine individuelle.
3. Wenn man EINE CSS-Datei hat, in der ALLES drinsteht, wird die EINMAL vom Client geladen und dann erstmal nicht wieder. Und genau das ist der Optimalzustand.

[Xantiva]

Wenn man EINE CSS-Datei hat, in der ALLES drinsteht, wird die EINMAL vom Client geladen und dann erstmal nicht wieder.

Es sei denn, der Server ist nicht vernünftig konfiguriert und die Datei kann vom Browser nicht gecacht werden. Dass ist dann aber eine Sache für den Serveradmin und nicht ein Problem des Shops.

[EnsembleUn]

Das es auf den ersten Blick nich performant wäre, ist mir klar. Aber ist es performant 90% unnötigen CSS-Code die ganze Zeit mit zu schleppen? Klar, der Code wird einmal geladen, aber auch sinnloser
Weise mit sich herumgeschleppt.

Denn wenn es, wie Doc Olson sagt sinnfrei wäre, wieso bemängelt das sowohl Google Pagespeed, als auch YSlow? Irgendetwas muss ja dran sein.

Bei einer ganz einfachen Webseite ist das auch nicht das Riesenproblem, weil ich dort für jede Seite eine eigene CSS-Datei erstellen kann, die dann einmal geladen wird und ebenfalls im Cache bleibt.

[berny]

Das kommt drauf an, was man will.
In der Css steht ja nichts drinnen, was sich großartig ändert, ergo lade ich das einmal und habe es lokal immer am Rechner beim Browsen zur Verfügung.

zB beim Laden der Startseite wird die Css geladen, bei jedem weiteren Klick im Shop nichts mehr.

Bei deinem Ansatz ist es zwar so, dass du nur eine kleine CSS ladest, aber dafür bei jedem Klick immer wieder die weiteren CSS.

Deshalb frage ich mich, wo du hier den Vorteil der Performance siehst.

Beachte auch, dass Seitenbewerter immer nur eine Seite incl aller abhängigen Daten sehen, nicht aber das komplette Projekt.
Ergo kann es schon vorkommen, dass eine größere CSS einfach schlechter bewertet wird, sich aber praktisch besser auswirkt.

[Doc Olson]

Beachte auch, dass Seitenbewerter immer nur eine Seite incl aller abhängigen Daten sehen, nicht aber das komplette Projekt.
Ergo kann es schon vorkommen, dass eine größere CSS einfach schlechter bewertet wird, sich aber praktisch besser auswirkt.

Das bringt es auf den Punkt!

[EnsembleUn]

Ok, dann verwerfe ich diesen Gedanken wieder und muss eben damit leben keine 100/100 Punkten zu erreichen. *schnief*

[Xantiva]

Prüfe mit YSlow, o.ä. ob die CSS, JS oder Bild - Dateien beim Aufruf der nächsten Seite aus dem Cache kommen oder nicht. Wenn das sauber funktioniert, ist dann würde ich mich um die restlichen Pünktchen nicht mehr kümmern. YSLow schlägt je nach Einstellung auch immer ein CDN vor ... Und das braucht der "normale Shop" nun wirklich nicht.

Ciao,
Mike

[jeedee]

Ok, dann verwerfe ich diesen Gedanken wieder und muss eben damit leben keine 100/100 Punkten zu erreichen. *schnief*

man lässt sich schnell von solchen optimierungstools leiden und man will immer die 100% was nicht geht, ich habe damit aufgehört, man wird richtig wuschig dabei und steht am ende genau so radlos da wie am anfang.
es wird viel geschreiben wenn der tag lang ist und rauskommen tut dabei auch nichts, ausser verwirrte köpfe