Cache-busting og versionering

Har du nogensinde opdateret dit websted eller din applikation for så at opdage, at brugerne stadig ser den gamle version?

Dette almindelige problem skyldes ofte caching. Cachebusting er en teknik, der tvinger browsere og cacheservere (som CDN'er) til at indlæse den nyeste version af dine filer i stedet for at levere forældede, cachede kopier.

Cacher er fremragende til ydeevne, men de kan holde fast i gammelt indhold.

Når en browser eller et CDN cacher en fil (f.eks. et billede, CSS eller JavaScript), sker det normalt baseret på filens URL og bestemte HTTP-headere (som Cache-Control). Hvis URL'en aldrig ændres, opdager cachen måske aldrig, at filens indhold er blevet opdateret.

En af de enkleste metoder til cachebusting er at bruge en forespørgselsstreng. Du føjer en unik identifikator (f.eks. et versionsnummer eller et tidsstempel) til slutningen af en fils URL.

Når forespørgselsstrengen ændres, ser browseren eller CDN'et den som en helt ny URL og tvinges derfor til at hente den opdaterede fil fra oprindelsesserveren.

Her er et eksempel på, hvordan du kan bruge en forespørgselsstreng til at rydde cachen for en CSS-fil:

<link rel="stylesheet" href="/css/style.css?v=1.0.1">

Hvis du opdaterer style.css, ændrer du versionen: /css/style.css?v=1.0.2. Det signalerer til cacherne, at en ny version er tilgængelig.

Selvom de er nemme at bruge, har forespørgselsstrenge ulemper:

• Nogle proxyservere ignorerer måske forespørgselsstrenge under caching, hvilket kan føre til forældet indhold.
• Hver ændring af forespørgselsstrengen opretter en ny cachepost, hvilket potentielt fragmenterer cacherne.
• Metoden udnytter ikke eksisterende cachede versioner, hvis kun en lille del af filen er ændret.

Til kritiske ressourcer foretrækkes ofte mere robuste metoder.

En mere effektiv teknik går ud på at indlejre en hash af filens indhold direkte i filnavnet.

For eksempel bliver main.css til main.d41d8cd9.css. Hvis blot ét tegn i main.css ændres, bliver dens hash helt anderledes, hvilket skaber et unikt filnavn.

Buildværktøjer som Webpack eller Gulp automatiserer almindeligvis denne proces. De genererer en unik hash baseret på filens indhold og omdøber den under udrulningen.

Denne metode sikrer, at kun helt nye filer hentes, mens gamle, uændrede filer kan forblive cachelagret i det uendelige, så cacheeffektiviteten maksimeres.

Cache-invalidering er ikke kun til statiske filer. For dynamisk indhold eller API'er hjælper versionsstyring med at håndtere ændringer.

Versionsstyring af API'er indebærer, at API'ets endpoint-URL ændres (f.eks. /api/v1/products til /api/v2/products), eller at der bruges en brugerdefineret HTTP-header (f.eks. X-API-Version: 2).

Effektiv cache-invalidering kombinerer ofte flere strategier:

• Automatisér hashing: Brug buildværktøjer til statiske ressourcer.
• Aggressiv caching: Angiv lange cachevarigheder for filer med hash.
• Versionsstyring af API'er: Brug dette ved inkompatible ændringer i dynamisk indhold.
• Betingede forespørgsler: Brug ETag eller Last-Modified til små, hyppige opdateringer.

Målet er at levere aktuelt indhold pålideligt og samtidig maksimere antallet af cachetræffere.

Vi har lært, at cache-invalidering og versionsstyring er afgørende for at levere aktuelt indhold i miljøer med caching.

Ved at bruge teknikker som forespørgselsstrenge eller, endnu mere robust, hashing af filindhold til statiske ressourcer samt eksplicit versionsstyring af API'er kan du sikre, at brugerne altid oplever de nyeste funktioner og rettelser uden at ofre ydeevne.