Strategie zum laden von CSS/JS

[socki]

Ich glaube, der Sinn meines Vorhabens ist noch kein Stück rübergekommen oder? Liegt vielleicht auch daran, dass ich einige Begriffe falsch verwendet habe. Sorry! Mit inline CSS meine ich eigentlich ein zentrales style-Element. Und mit CSS Script meine ich eine externe CSS-Datei (richtig so oder?). Also nochmal zum Kern der Sache:

Ich möchte die Vorteile eines style-Elements im html (weniger Requests) mit den Vorteilen des externen CSS (Browser Caching) verbinden. Die meisten deiner Einwände sollten sich vor diesem Hintergrund erübrigt haben. Aber ich will nochmal kurz auf die Kommentare eingehen.

"above-the-fold"?? Alle CSS-Referenzen im head ist zunächst mal normal, ja geradezu zwingend. Woanders darf es nämlich gar nicht stehen.

Hier mal eine Seite, die ganz am Ende in Dokument noch ein style-Element verwendet: https://www.was-soll-ich-schenken.net/ Die Seite läd sogar außergewöhnlich schnell. Wenn's funktioniert, funktioniert's.

2. Ich lade es inline, um zusätzliche Requests einzusparen

Das ist kontraproduktiv. Die Einsparung eines Requests pro Seitenaufruf in allen Ehren, aber damit steigt für dich der Pflegeaufwand. Denn die Wahrscheinlichkeit ist doch sehr groß, dass wesentliche Teile des Stylesheets für alle Seiten deiner Website gleich sind. Hier würde ich die Wartungsfreundlichkeit höher ansetzen als ein paar Zehntelsekunden wegen eines weiteren Requests - abgesehen davon, dass das Stylesheet bei weiteren Aufrufen dann schon im Browser-Cache wäre und überhaupt nicht mehr geladen werden muss.

Ich gehe mal nicht davon aus, dass du mit inline meinst, style-Attribute im Markup zu verwenden.

Da du ja schon selbst erkannt hast, dass ich mit "inline" ein zentrales style-Element meinte und kein Style Attribut (nochmals sorry), macht deine Aussage nicht wirklich Sinn. Die CSS Regeln, die für alle Seiten gleich sind, können als CSS-Block in den head geschrieben werden oder aus einer externen Datei eingebunden werden. Macht vom Aufwand keinen Unterschied. Und das mit dem Browser Cache versuche ich ja durch die externe Datei im footer zu bezwecken.

3. Ich binde exakt denselben CSS Code nochmal als externes Script vor dem schließenden body tag ein.

Das ist Unfug. Was soll das bringen? Abgesehen davon, dass <style> an dieser Stelle nicht erlaubt ist.

Das befördert das CSS für spätere Seitenaufrufe in den Browsercache. <style> ist zwar nicht erlaubt, funktioniert aber trotzdem (s.o.). Und wie ich bereits geschrieben habe, will ich es auch per <link> tag einbinden.

4. Falls es weitere Seitenaufrufe durch denselben Benutzer gibt (mittels Session Variable oder Cookie ermitteln???), gebe ich das CSS nur noch als externes Script im head aus (kein inline und kein Footerscript mehr).

Warum?? Oder besser: Warum nicht von Anfang an so?

Weil meine Methode beim erstmaligen Seitenaufruf schneller läd (hoffe ich jedenfalls).

Der Kern meiner Frage ist vermutlich: Beeinträchtigt eine zusätzliche CSS Datei im Footer (extern per <link..> eingebunden) die Ladezeit? Und wird bei darauffolgenden Seitenaufrufen dieselbe Datei (diesmal im head eingebunden) vom Browser ignoriert? Sie sollte ja im Cache sein.

Ich werd es mal auf einer Testseite ausprobieren. Bliebe zuletzt aber noch die Frage bei welchem Prozentsatz der User das Browsercaching fehlschlägt.