.NET Core Tipp: Static Files im Browser Cache zwischenspeichern (Cache-Header)

Problem

Bei der Analyse der Seite .NET User Group Bern zur Page Speed und YSlow – Optimierung zeigte die Auswertung die Meldung «Leverage browser caching for the following cacheable resources».

Zur Optimierung der Performance lassen sich statische Ressourcen, die sich selten ändern im Browser Cache zwischenspeichern.

Abbildung zeigt eine Liste statischer Dateien, die im Browsercache zwischengespeichert werden können

Die Kennzahlen zeigten vor der Korrektur folgende Werte:

Abbildung zeigt die Gesamtkennzahlen PageSpeed mit 83% und YSlow mit 71%.

Aktion

Um in .NET Core für statische Dateien einen Cache-Header einzufügen ist in der Startup.cs eine Anpassung nötig.

In der Methode Configure muss der Aufruf app.UseStaticFiles() erweitert werden.

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    app.UseStaticFiles(new StaticFileOptions
    {
        OnPrepareResponse = ctx =>
        {
            const int durationInSeconds = 60 * 60 * 24 * 7;
            ctx.Context.Response.Headers[HeaderNames.CacheControl] =
                        $"public,max-age={durationInSeconds}";
        }
    });
...
}

Resultat

Nach dieser Anpassung werden die statischen Dateien im Browser-Cache zwischengespeichert. Die Kennzahl Leverage Browser Caching hat neu statt F (25) die Bewertung A (96)

Abbildung zeigt die Liste der statischen Files nach der Anpassung. Eine Datei mit 5 Stunden Cache-Dauer wird noch angezeigt.

Die Kennzahlen für Page Speed und YSlow haben neu folgende Werte:

Abbildung zeigt Werte nach der Korrektur. Page-Speed mit 91% und YSlow mit  82%.

Eine kleine Anpassung mit grosser Wirkung.