Mehrere CSS Dateien

[xXxPeterPanxXx]

Hi,
ich brauch euren Rat. Meine CSS Datei ist nun 10kb groß und ich dachte mir das ich die vielleicht in mehrere kleine zerstückeln kann, damit nicht immer alle Stylesheets geladen werden, sondern nur die gebraucht werden.

Also das ich statt 10kb nur 5+2 kb lade.


Lohnt sich das für die Performance?

MfG xXxPeterPanxXx

 

[Flemli200]

Ich hab das bei meiner ersten website mit css gemacht, weil ich viele befehle, die das gleiche gemacht haben aus unwissen immer neu erstellt hab und daher eine einzelte ca 30kb groß war... ich hab sie in mehrere kleine zerstückelt... die website hat zwar etwas schneller geladen, aber als ich die Website dann verändern wollte, musste ich in alle dateien die neuen daten eintragen...

Miener meinung nach, ist es daher praktischer wenn du die seite aktuell haltenb und neue themen hinzufügen möchtest, die css befehle alle in einer Datei zu lagern... wenn du jedoch viel arbeit haben möchtest, 'nur' damit die seite minimal schneller läd, schreib dir mehrere css dateien.

Du kannst sonst auch eine zur hintergrundformatierung und eine für die schrift und textformatierung benutzen...

 

[Efchen]

Geladen werden alle Stylesheets, die Du in der Seite einbindest.
Aber alle Stylesheets werden ja nur einmal geladen und dann gecached. Bei 10K ist das wohl kein Geschwindigkeitsvorteil, das aufzusplitten.
Das ist dann eher ein Nachteil, weil ja für jede Datei ein neuer HTTP-Request gestartet wird. Aber das wiederum auch nur einmal je Datei.

Aber es kann natürlich übersichtlicher sein, das thematisch zu trennen. Wobei es bei einem großen Projekt wohl wieder eher unübersichtlich wird, wenn Stylesheet 1 nur bei den Seiten 3-7, Stylesheet 2 bei Seite 1, 8 und 19 gebraucht wird usw. Da steigt man irgendwann nicht mehr durch.

 

[mermshaus]

Gegenfrage: Hast du ein Performanceproblem? :)

Das lohnt sich aber unter Garantie nicht. Es könnte sogar kontraproduktiv sein, aber da bin ich mir nicht absolut sicher. Ein Browser speichert Dateien wie Stylesheets üblicherweise lokal zwischen und ruft sie nur ab, wenn sie verändert wurden. Um das festzustellen, kann er die Header einer Datei nachfragen und deren Angaben mit denen der lokalen Version abgleichen, ohne gleich die komplette Datei laden zu müssen. Mehr CSS-Dateien könnten mehr Header-Abgleiche bedeuten.

 

[xXxPeterPanxXx]

Okay ihr habt ja Recht! :)

Dann arbeite ich so noch weiter!

ich kann Sie später immernoch zerstückeln.

MfG xXxPeterPanxXx