Template-css- und -js-Dateien und der Browser-Cache

Ideen für neue Funktionen in CONTENIDO?
Antworten
bodil
Beiträge: 302
Registriert: Fr 7. Okt 2011, 04:10
Kontaktdaten:

Template-css- und -js-Dateien und der Browser-Cache

Beitrag von bodil » Do 15. Dez 2022, 08:47

Guten Morgen!
Liefert Contenido Artikel aus, bindet es die js- und css-Dateien ein, die aus den Modulen des entsprechenden Templates zusammengetragen werden. Die Dateien heißen dann typischerweise cache/templatename.css oder cache/templatename.js.
Problematisch ist dabei, dass Änderungen an den Modul-Dateien oder auch das Hinzufügen neuer Module zwar zu neuem Code in diesen Dateien führt, Browser aber normalerweise keine Veranlassung sehen, diesen Dateien auch neu zu laden, falls es bereits eine ältere Version im Browser-Cache gibt.
Mein Vorschlag wäre hier, dem Dateinamen im HTML-Code eine Versions-Hash hinzuzufügen, der aus dem jeweiligen Inhalt der Datei resultiert.
Generiert wird die Url zu den Dateien in der Datei contenido/classes/module/class.module.handler.php in der Methode saveContentToFile():

Code: Alles auswählen

$url = $this->_cfgClient[$this->_client]['path']['htmlpath'] . $saveDirectory . '/' . $templateName . '.' . $fileType;
Im Anschluss an diese Zeile habe ich folgende eingefügt:

Code: Alles auswählen

if (($fileType == 'css' || $fileType == 'js') &&  $saveDirectory == 'cache') {
	$url .= '?v=' . substr(md5($fileContent), 0, 5);
}
So steht dann da beispielsweise cache/templatename.css?v=a87d5 als Url drinne.

Aufgerufen wird diese Methode eigentlich nur aus der Datei classes/code_generator/class.code.generator.standard.php und nur für die css- und die js-Datei, weshalb man die if-Abfrage auch weglassen könnte.

Aber apropos class.code.generator.standard.php:
Die besagten Tags mit den Links zu den Dateien werden nur generiert, wenn in den Dateien auch etwas drinsteht. (Methode _generate()) Dabei wird die Stringlänge des potentiellen Dateinhalts abgefragt. Resultiert die Datei aber aus leere css- oder js-Dateien in den Modulen, ist der Dateninhalt nicht leer, da die (leeren) Dateien mit PHP_EOL verbunden werden. Im Ergebnis kann dann eine css-Datei eingebunden werden, die nur Zeilenumbrüche enthält, was sicher nicht sinnvoll ist. Mein Vorschlag wäre hier, die Zeile

Code: Alles auswählen

if (cString::getStringLength($this->_cssData) > 0) {
zu ersetzen durch

Code: Alles auswählen

if (cString::getStringLength(trim($this->_cssData)) > 0) {
(mit den js-Dateien entsprechend).

Vielen Dank für eure Aufmerksamkeit.
Schönen Rest-Advent!
Bodil

Faar
Beiträge: 1837
Registriert: Sa 8. Sep 2007, 16:23
Wohnort: Brandenburg
Kontaktdaten:

Re: Template-css- und -js-Dateien und der Browser-Cache

Beitrag von Faar » Do 15. Dez 2022, 13:12

Besser wäre, in den Metatags no-cache einzufügen.
Ich finde nicht, dass man durch solche Aktionen auf das Caching der Browser reagieren sollte.
Es gibt möglichkeiten, den Browsercache manuell zu löschen.
Fliegt der Bauer übers Dach, ist der Wind weißgott nicht schwach.

bodil
Beiträge: 302
Registriert: Fr 7. Okt 2011, 04:10
Kontaktdaten:

Re: Template-css- und -js-Dateien und der Browser-Cache

Beitrag von bodil » Do 15. Dez 2022, 15:46

Was spricht gegen meinen Vorschlag?
Ich fände es schlecht, wenn Browser bei jedem Seitenbesuch solche Datei neu laden müssten. Dafür gibt es den Cache schließlich.
Und die Möglichkeit, dass man den Cache manuell löschen kann, hilft leider auch nicht. »Liebe Seitenbesucher*innen, wir haben an unserer Webseite gearbeitet. Sollte was blöd aussehen oder nicht funktionieren, drücken Sie einfach mal Strg + F5«?

xmurrix
Beiträge: 3042
Registriert: Do 21. Okt 2004, 11:08
Wohnort: Augsburg
Kontaktdaten:

Re: Template-css- und -js-Dateien und der Browser-Cache

Beitrag von xmurrix » Fr 16. Dez 2022, 20:39

Die Angabe der Cache-Dauer im Meta-Tag kann nicht ausreichend sein, da z.B. Proxy-Server in Firmennetzwerken die Angaben im Meta-Tag ignorieren und somit die gecachte Version der eingebundenen JS-/CSS-Dateien ausliefern würden.

Wir haben im CONTENIDO-Backend nach einem Update ein ähnliches Problem, der Browser liefert die gecachten Versionen der Dateien, siehe das Ticket #100 dazu.

Mit wäre es recht, wenn wir eine Lösung haben, die wir sowohl im Backend als auch im Frontend verwenden können. Meines erachtens kommen wir nicht drum herum, die Hashes entweder in die Dateinamen zu integrieren, dann müssen wir sie mittels htaccess-Regel an die richtige Datei umleiten, oder den Hash als GET-Parameter an die Dateinamen anhängen. Das Letztere wäre die einfachste Lösung.

Assets (JS-/CSS-Dateien), die sich im Frontend in cms/css, cms/js, cms/cache, cms/data/modules und im Backend in contenido/external, contenido/scripts, contenido/styles, contenido/plugins usw. ändern wären davon betroffen, vermutlich muss man auch andere Stellen berücksichtigen.

bodil
Beiträge: 302
Registriert: Fr 7. Okt 2011, 04:10
Kontaktdaten:

Re: Template-css- und -js-Dateien und der Browser-Cache

Beitrag von bodil » So 18. Dez 2022, 12:28

Hi Xmurrix!
Vielen Dank für deine Antwort!
Das Problem mit den Dateien im Frontend ist zwar immer dasselbe (der Browser zieht geänderte Dateien nicht, weil veraltete Versionen im Browsercache liegen), technisch sind die von mir genannten Fälle aber doch besonders. Änder ich eine Datei in cms/js kann ich den besagten Get-Parameter z. B. im Layout anfügen, wo ich die Datei einbinde. Das ist bei den Dateien, die fürs Template geladen werden, nicht so einfach möglich. Praktikabelster workaround ist vielleicht noch, das Template nach einer Änderung in den css- oder js-Dateien umzubenennen ... aber das kann es ja nicht sein.
Bei den Dateien in cms/cache fehlt mir etwas die Phantasie, was das sein könnte. Bir mir landen da nur Bilder, deren Namen einen Hash beinhalten, ich habe die Möglichkeiten von Contenido aber noch nicht voll ausgeschöpft. Kann da noch mehr landen?
Liebe Grüße aus Hessen
Bodil

xmurrix
Beiträge: 3042
Registriert: Do 21. Okt 2004, 11:08
Wohnort: Augsburg
Kontaktdaten:

Re: Template-css- und -js-Dateien und der Browser-Cache

Beitrag von xmurrix » Mi 11. Jan 2023, 10:55

Hallo Bodil,

wir haben verschiedene Stellen, in denen Pfade zu CSS- und JS-Dateien verwendet werden, manche sind in Layouts, manche in Templates und manche werden in CONTENIDO beim Generieren des Codes der Seite (Frontend) erstellt. Das Letztere speichert z.B. die Dateien unter "cms/cache" ab.

Daneben kann es sein, dass Module oder Plugins auch irgendwelche CSS- und JS-Dateien einbinden.

Das Cache-Problem kann man teilweise natürlich lösen, indem man den Parameter "v=xxx" anhängt, sofern man da die Kontrolle über den Code oder die Ausgabe hat, z. B. in Frontend-Layouts und in Modul-Templates. In Backend-Seiten/-Templates oder beim Generieren des Codes der Seite (Frontend) wird das so nicht möglich sein. Um das Problem ganzheitlich zu lösen, ist es meiner Meinung nach nötig, eine Funktionalität in CONTENIDO zu implementieren, mit der man all die Fälle abdeckt.

Ich dachte da an einen Asset-Helper, der man den Pfad zur CSS- und JS-Datei übergibt und dieser den angepassten Pfad, z. B. mit dem Parameter "v=xxx" zurückliefert. Das kann eine Funktion sein, die im PHP-Kontext verwendet werden kann und für Backend-Templates sowie für Frontend-Templates (Smarty) kann man da die nötigen Helper/Modifier implementieren.

Gruß

xmurrix

Antworten