Selaimen välimuisti (Browser Cache) tarkoittaa sitä, että verkkoselain tallentaa ladatut tiedostot käyttäjän laitteelle (tietokoneelle, puhelimelle), jotta niitä ei tarvitse ladata palvelimelta uudelleen seuraavilla vierailuilla.
Mitä selain tallentaa välimuistiin?
Selain voi tallentaa lähes kaikki sivuston tiedostot:
- CSS-tyylitiedostot — sivuston ulkoasu
- JavaScript-tiedostot — sivuston toiminnallisuus
- Kuvat — valokuvat, logot, ikonit
- Fontit — verkkofontit (woff2-tiedostot)
- HTML-sivut — itse sivujen sisältö (harvemmin)
- Muut mediatiedostot — videot, PDF:t
Miten selaimen välimuisti toimii?
Välimuistin toiminta perustuu HTTP-otsikoihin:
- Ensimmäinen vierailu — selain lataa kaikki tiedostot palvelimelta ja tallentaa ne paikallisesti
- Cache-Control-otsikko — palvelin kertoo kuinka kauan tiedostoa saa säilyttää (esim.
max-age=31536000= 1 vuosi) - Seuraava vierailu — selain tarkistaa välimuistin ja käyttää tallennettua versiota
- Vanhentunut tiedosto — jos välimuistiaika on umpeutunut, selain pyytää uuden version
Tehokkaasti välimuistitettu sivusto latautuu toisella vierailulla murto-osassa alkuperäisestä ajasta.
Välimuistin strategiat
Kaksi päästrategiaa tiedostojen välimuistittamiseen:
Pitkä välimuisti + tiedostonimen versiointi
- Staattiset tiedostot (CSS, JS, kuvat) välimuistitetaan vuodeksi
- Tiedostonimeen lisätään hash:
styles.a1b2c3.css - Kun sisältö muuttuu, hash muuttuu ja selain lataa uuden version
Lyhyt välimuisti + uudelleenvalidointi
- HTML-sivut välimuistitetaan lyhyeksi aikaa (minuutteja tai tunteja)
- Selain tarkistaa palvelimelta onko sisältö muuttunut (ETag/Last-Modified)
- Jos sisältö ei ole muuttunut, palvelin vastaa nopeasti 304 Not Modified
Yhteenveto
Selaimen välimuisti on yksi tärkeimmistä sivuston nopeusoptimoinnin keinoista. Oikein konfiguroituna se vähentää palvelimen kuormaa ja nopeuttaa toistuvia vierailuja merkittävästi. Sivustoissamme käytämme pitkää välimuistia staattisille tiedostoille (1 vuosi) ja lyhyttä välimuistia HTML-sivuille — näin sisältöpäivitykset näkyvät heti, mutta CSS, JavaScript ja kuvat latautuvat välimuistista.