Heim > Web-Frontend > Front-End-Fragen und Antworten > So richten Sie den Bildcache in NodeJS ein

So richten Sie den Bildcache in NodeJS ein

PHPz
Freigeben: 2023-04-17 15:44:30
Original
849 Leute haben es durchsucht

Auf modernen Websites spielen Bilder eine entscheidende Rolle. Sie sind nicht nur ästhetisch ansprechend, sondern können auch die Geschwindigkeit und Leistung Ihrer Website optimieren. Das erneute Herunterladen von Bildern jedes Mal, wenn ein Benutzer Ihre Website besucht, kann jedoch zu langsamen Ladezeiten führen. Das ist es, was das Bild-Caching bewirkt. In diesem Artikel erfahren Sie, wie Sie das Caching von Bildern einrichten, um Ihre Node.js-Website zu optimieren.

Was ist Bild-Caching?

Bild-Caching bezieht sich auf das Speichern heruntergeladener Bilder im lokalen Speicher, um zu vermeiden, dass dieselben Bilder jedes Mal erneut heruntergeladen werden, wenn der Benutzer die Website besucht. Indem Sie die Häufigkeit des erneuten Herunterladens von Bildern reduzieren, können Sie die Ladegeschwindigkeit Ihrer Website erheblich verbessern. Wenn der Benutzer die Seite erneut besucht, prüft der Browser zunächst, ob das gleiche Bild bereits im lokalen Speicher vorhanden ist. Falls vorhanden, wird das Bild direkt aus dem lokalen Speicher geladen und nicht erneut vom Server heruntergeladen.

Bild-Cache festlegen

Um den Bild-Cache einzurichten, müssen wir HTTP-Header verwenden, um den Browser darüber zu informieren, wann neue Bilder geladen werden sollen und wann bereits zwischengespeicherte Bilder geladen werden sollen . Bild. Dies kann mithilfe der Header Cache-Control und Expires erreicht werden.

Der Cache-Control-Header ist die am häufigsten verwendete Option und ermöglicht es Ihnen, das Caching-Verhalten pro Ressource anzugeben. Durch Festlegen von Cache-Control im Antwortheader können Sie dem Browser mitteilen, wie lange die Ressource zwischengespeichert werden soll, oder dem Browser mitteilen, unter welchen Bedingungen die Ressource zwischengespeichert werden soll.

// Beispielcode: Lassen Sie den Browser statische Ressourcendateien ein Jahr lang zwischenspeichern
app.use(express.static('public', { maxAge: '1y' }))#🎜 🎜 #

Dieser Code weist den Browser an, statische Ressourcendateien ein Jahr lang zwischenzuspeichern. Wenn ein Benutzer die Website zum ersten Mal besucht, werden auf diese Weise alle statischen Ressourcendateien zwischengespeichert und müssen im nächsten Jahr nicht erneut heruntergeladen werden.

Eine andere Möglichkeit, das Bild-Caching einzurichten, ist die Verwendung des Expires-Headers. Sie können Expires verwenden, um dem Browser mitzuteilen, wann er ablaufen soll, und die Ressource erneut herunterzuladen. Expires ist eine in HTTP 1.0 verwendete Methode, die dem Browser mitteilt, wann er Ressourcen erneut abrufen soll.

// Beispielcode: Stellen Sie die Bild-Cache-Zeit auf ein Jahr ein

app.get('/images/:name', function(req, res, next) {
res .setHeader('Expires', new Date(Date.now() + 31536000000).toUTCString())
next();
})

Dieser Code sagt das Browser Der Server speichert dieses Bild ein Jahr lang im Cache. Es ist zu beachten, dass es sich bei „Expires“ um eine absolute Zeit handelt und es daher zu Zeitzonenproblemen kommt. Wir müssen die Zeit mit der Methode toUTCString() in UTC-Zeit umrechnen, um Zeitzonenprobleme zu vermeiden.

Zusammenfassung

In diesem Artikel haben wir besprochen, wie Sie das Bild-Caching einrichten, um die Leistung Ihrer Node.js-Webanwendung zu verbessern. Wir haben die Header „Cache-Control“ und „Expires“ erklärt und Codebeispiele bereitgestellt, die Ihnen beim Einrichten des Bild-Caching-Verhaltens helfen. Durch den Einsatz dieser Technologien können Sie die Ladezeit der Website erheblich verkürzen, den Bandbreitenverbrauch reduzieren und den Benutzern ein besseres Erlebnis bieten. Gleichzeitig müssen wir bedenken, dass der Cache eine Lebensdauer hat und daher zum richtigen Zeitpunkt geleert werden muss, um die Aktualität des Inhalts sicherzustellen.

Das obige ist der detaillierte Inhalt vonSo richten Sie den Bildcache in NodeJS ein. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage