Når en besøgende åbner din hjemmeside for første gang, downloader deres browser alle de filer, der skal bruges til at vise siden: HTML, stilark, scripts, billeder og skrifttyper. Ved et besøg, der kommer igen, behøver browseren ikke downloade alle de filer igen, hvis de er gemt lokalt. Caching i browseren er det, der gør det muligt, og det er en af de enkleste måder at få en hjemmeside til at føles hurtigere for besøgende, der vender tilbage.
Caching i browseren gemmer kopier af filer fra hjemmesiden på den besøgendes enhed, så de næste indlæsninger kan springe over at downloade ressourcer, der ikke har ændret sig. Serveren fortæller browseren, hvor længe hver fil skal gemmes, og hvornår den skal tjekke efter nye versioner. Når du forstår, hvordan caching i browseren virker, kan du se, hvorfor besøg, der kommer igen, ofte føles mærkbart hurtigere end det første.
Hvordan virker caching i browseren?
Hver fil, din server sender, indeholder instruktioner om cache i HTTP-svarets headers. De headers fortæller browseren, om filen skal gemmes, hvor længe den skal gemmes, og hvornår den skal bede om en ny kopi.
Ved det første besøg downloader browseren alle de nødvendige filer fra din server og gemmer de filer, der kan caches, i lokal lagring. Ved besøg, der kommer igen, indlæser browseren gyldige filer fra lokal lagring i stedet for at downloade dem igen.
Hvilke filer får mest ud af caching i browseren?
Ikke alle filer bør caches lige længe. Statiske ressourcer, der sjældent ændrer sig, er ideelle. Dynamisk indhold, der opdateres ofte, skal have kortere tid i cache eller slet ingen cache.
Lang tid i cache
- Stilark og JavaScript-filer, der kun ændrer sig, når du opdaterer sidens design
- Billeder af logoer, ikoner og favicons
- Filer med skrifttyper
- Baggrundsbilleder og dekorative grafikker
Kort tid i cache eller ingen cache
- HTML-sider med indhold, der opdateres ofte
- Sider med personligt eller dynamisk indhold
- Svar fra API'er og adresser, der behandler formularer
Princippet er enkelt: Cache hårdt det, der sjældent ændrer sig, og cache forsigtigt det, der ændrer sig ofte. Artiklen om hvad caching er, og hvorfor det er vigtigt, dækker hele billedet af caching, også caching på serveren og i et CDN.
Hvorfor har caching i browseren betydning for hastighed?
Caching i browseren mindsker direkte den mængde data, en besøgende skal downloade, og antallet af forespørgsler til serveren ved besøg, der kommer igen. Begge forbedringer giver hurtigere indlæsning af siderne.
Hurtigere oplevet indlæsningstid
Det tager millisekunder at indlæse et stilark fra lokal lagring. Det tager hundredvis af millisekunder eller mere at downloade den samme fil over en netværksforbindelse, afhængigt af forbindelsens hastighed. Ved besøg, der kommer igen, dukker filer fra cachen op næsten med det samme, og det får siden til at føles markant hurtigere, selv før nyt indhold indlæses.
Mindre belastning på serveren
Hver fil, der leveres fra browserens cache, er én forespørgsel mindre, som din server skal håndtere. For sider med besøgende, der kommer igen, forbedrer det svartiden for alle besøgende.
Bedre ydeevne på mobil
Forbindelser på mobil er typisk langsommere end forbindelser på computer. Caching i browseren giver en endnu større gevinst i hastighed på mobil, fordi den fjerner forespørgsler på nettet, som ville være langsomme på svagere forbindelser. Artiklen om hvorfor hastighed på mobil er vigtig forklarer, hvorfor det led er særligt vigtigt for besøgende på mobil.
Sådan håndterer WEMASY caching i browseren
WEMASY sætter passende headers for cache på alle typer filer automatisk. Statiske ressourcer som stilark, scripts og billeder får lang tid i cache. HTML-sider får kortere tid, så ændringer i indholdet vises hurtigt efter udgivelse. Når du laver ændringer i editoren, opdaterer WEMASY's system versionerne i cache, så besøgende, der kommer igen, får frisk indhold uden at skulle rydde cachen manuelt.
Se, hvad der er med, hos WEMASY hjemmesidebygger, eller se planerne på prissiden.
Ofte stillede spørgsmål
Hvad er caching i browseren?
Caching i browseren gemmer kopier af filer fra en hjemmeside på den besøgendes enhed, så besøg, der kommer igen, indlæses hurtigere. Serveren sender instruktioner om cache med hver fil og fortæller browseren, hvor længe den skal beholde den, før den tjekker efter opdateringer. Med WEMASY's hjemmesidebygger kan du sætte det op direkte på din hjemmeside.
Hvad er forskellen på caching i browseren og caching på serveren?
Caching i browseren gemmer filer på den besøgendes enhed, så siden indlæses hurtigere ved deres besøg, der kommer igen. Caching på serveren gemmer sider, der er bygget på forhånd, på hostingserveren, så processen med at bygge siden ikke kører ved hver forespørgsel. Begge dele gør indlæsningstiden kortere, men de virker på forskellige punkter i vejen frem til den besøgende.
Hvorfor er min hjemmeside hurtig ved andet besøg, men langsom ved det første?
Det første besøg kræver, at alle ressourcerne på siden downloades fra serveren. Det andet besøg indlæser mange af de ressourcer fra browserens cache, og det er meget hurtigere. Det er normalt og viser, at caching i browseren virker. Når du optimerer det første besøg, handler det om komprimering af billeder, serverens svartid og færre ressourcer, der blokerer visningen.
Kan besøgende se gammelt indhold på grund af caching i browseren?
Ja, hvis tiden i cache er for lang, og serveren ikke opdaterer versionerne i cache, efter at indholdet er ændret. Platforme, der er styret godt, håndterer det automatisk ved at opdatere identifikatorerne i cache, når du udgiver ændringer. Besøgende får så nye filer ved deres næste besøg uden selv at skulle rydde cachen i deres browser.
Skal jeg rydde min cache i browseren for at teste min hjemmeside?
Det er nyttigt at rydde cachen i din browser, når du tester, om nye ændringer vises rigtigt. Det simulerer oplevelsen for en besøgende, der kommer for første gang. Til almindelig brug af din egen side er det ikke nødvendigt at rydde cachen. Brug et privat vindue eller inkognitovindue til at teste uden at påvirke dine almindelige filer i cache.
Skal jeg selv sætte caching i browseren op?
På en platform til hjemmesider, der er administreret for dig, bliver headers for cache sat op automatisk ud fra typen af fil. På hosting, du styrer selv, kræver opsætning af cache indstillinger på serveren eller udvidelser til caching. WEMASY håndterer al opsætning af caching i browseren uden teknisk arbejde fra din side.