Eine einfache Möglichkeit, den CSS-, JavaScript- und Hintergrundbild-Cache im Browser zu leeren
|
Im eigentlichen Projektentwicklungsprozess wird die Seite auf den Server hochgeladen. Um die Belastung des Servers zu verringern und den Benutzern weniger Ladezeit zu ermöglichen, speichert der Browser Bilder, CSS und JS lokal im Cache, um sie beim nächsten Besuch der Website zu verwenden. Dadurch wird nicht nur die Belastung des Servers verringert, sondern auch die Anzahl der Downloads für die Benutzer reduziert, was zu einem besseren Benutzererlebnis führt. Beim Upgrade der Version oder bei einigen Anpassungen an CSS, JS usw. führt der Cache jedoch dazu, dass Benutzer den aktualisierten Stil nicht anzeigen können, was Probleme bereitet. Sofern der Benutzer den Cache nicht manuell aktualisiert, werden fast alle Benutzer den Cache nicht manuell leeren, um normal auf die Website zuzugreifen, da sie nicht wissen, ob es sich um ein Cache-Problem handelt. Letztendlich denken die Benutzer einfach, dass es ein Problem mit Ihrer Seite gibt und sie nicht normal aufgerufen werden kann. Um den Cache normal zu verwenden und solche Probleme zu vermeiden, können wir unseren Verstand nutzen und darüber nachdenken, wie wir dieses Problem lösen können. Wenn auf den geänderten Stil nicht normal zugegriffen werden kann, wie wäre es mit der Änderung des Stildateinamens? Die Antwort ist ja und wird hier nicht überprüft. Allerdings ist es offensichtlich zu mühsam, den Dateinamen jedes Mal manuell zu ändern. Ist es möglich, den Dateinamen nicht zu ändern? Die Antwort ist ja. Möglicherweise fügen wir nach dem Namen der importierten Datei eine Versionsnummer hinzu, die sich von der vorherigen Version unterscheidet (normalerweise das Aktualisierungsdatum). Der Code lautet wie folgt: Code kopieren Der Code lautet wie folgt:<link rel="stylesheet" type="text/css" href="reset.css?v=20140829"> <script type="text/javascript" src="core.js?v=20140829"></script> Sie können sehen, dass auf meinen CSS-Dateinamen und meinen JS-Dateinamen „v=20140829“ folgt. Auf diese Weise kann ich die Dateien zwischenspeichern, ohne den Dateinamen zu ändern, und sie in Echtzeit aktualisieren. „v=20140829“ ist nur eine allgemeine Schreibweise und kann durch andere ersetzt werden. Schließlich gibt es noch Bilder. Bilder mit img-Tags haben im Allgemeinen keine doppelten Namen, da die Dateinamen im Hintergrund generiert werden. Handelt es sich um ein Bild mit einem festen Dateinamen, ist die Vorgehensweise die gleiche wie oben. Was das Hintergrundbild betrifft, wird mit der Änderung des Stilnamens der Bildauflösungspfad natürlich synchron aktualisiert, sodass auch das Hintergrundbild aktualisiert wird. |
<<: Zusammenfassung der häufig verwendeten Datenbank- und Tabellen-Sharding-Lösungen von MySQL
>>: Detaillierte Erklärung der Grundkonzepte von HTML
Artikel empfehlen
Warum wird UTF-8 in MySQL nicht empfohlen?
Ich bin kürzlich auf einen Fehler gestoßen, als i...
Erklärung des Problems, dass der strikte Modus von JavaScript kein Oktal unterstützt
Was das Problem betrifft, dass der strikte Modus ...
Lassen Sie IE6, IE7, IE8 CSS3-abgerundete Ecken und Schattenstile unterstützen
Ich möchte eine Seite mit CSS3-abgerundeten Ecken...
Detaillierte Installationsanleitung für das Cloud-Server-Pagoda-Panel
Inhaltsverzeichnis 0x01. Installieren Sie das Pag...
Zusammenfassung gängiger HTML-Elemente, einschließlich Grundstruktur, Dokumenttyp, Kopfzeile, Textkörper usw.
1. Grundstruktur: Code kopieren Der Code lautet wi...
So zeichnen Sie die Zeitleiste mit Vue+Canvas
In diesem Artikelbeispiel wird der spezifische Co...
MySQL 8.0.20 Window10 kostenlose Installationsversion Konfiguration und Navicat Management Tutorial Grafik detaillierte Erklärung
1. MySQL 8.0.20 herunterladen und dekomprimieren ...
Führen Sie die Schritte zum Erstellen einer Laravel-Entwicklungsumgebung mit Docker aus
Vorwort In diesem Artikel verwenden wir Docker, u...
Der Ansichtsbereich im Meta-Tag steuert das Gerätebildschirm-CSS
Code kopieren Der Code lautet wie folgt: <meta...
Vue implementiert eine Scroll-Ladetabelle
Inhaltsverzeichnis Ergebnisse erzielen Wissensres...
Der Unterschied zwischen Schaltfläche und Eingabetyp = Schaltfläche und Vorsichtsmaßnahmen
<button>-Tag <br />Definition und Verw...
Neue Funktionen in MySQL 8.0 - Einführung in Check Constraints
Inhaltsverzeichnis Vorwort Einschränkungen prüfen...
Installieren Sie Jenkins mit Docker und lösen Sie das Problem des anfänglichen Plugin-Installationsfehlers
Nach der Installation von Jenkins schlägt der ers...
MySQL erklärt das Prinzip und Beispiel zum Abrufen von Abfrageanweisungen
„explain“ wird verwendet, um Informationen zum Ab...
Tutorial zur Installation von Pycharm und Ipython unter Ubuntu 16.04/18.04
Unter Ubuntu 18.04 1. sudo apt install python ins...