HTTP cachleme mekanizması nasıl çalışır
Dec 18, 2016 · 3 minute read · Commentsprogramming
Bir websitesi gelistirirken en cok onem verdigimiz seylerden bir taneside performans. Bunun icin web sayfalarimiza yapilan her istekte yuklenen resim, css ve js dosyalarida dahil olmak uzere sunucudan clienta gelen butun cevaplarin olabildigince uzun sure cachelenmesini istiyoruz.
BU yazimda sizlerle HTTP cacheleme mekanizmasi nasil calistigindan biraz bahsedecegim daha sonrada browserlarin websitemizi daha uzun sure cachelemesini saglayip, statik dosyalarimiz degistiginde de yeni versiyonu indirmelerini nasil saglayabiliriz ondan bahsedecegim.
HTTP cacheleme mekanizmasi nasil calisir?
Diyelimki herhangi bir cacheleme uygulanmayan bir yapida kullanici sunucuya bir javascript dosyasini almak icin istek gonderdi ve sunucu 1MB boyutunda olan dosyamizi kullaniciya cevap olarak dondurdu. Kullanici ayni adrese tekrar istek yaptiginda 1MB boyutundaki dosyamizi tekrardan indirir. Her istek yapildiginda ayni dosyanin tekrar tekrar sunucudan indirilmesi hem sayfamizin yavas acilmasina sebep olacak hemde sunucu maliyetlerini artiracaktir. Bunun onune gecmek icin web sunucumuzun gonderdigi her istek ile beraber bir takim header bilgisi gondeririz. Client bu headerlara bakarak istekleri belirtilen sure boyunca cacheler ve sunucuya belirli bir sure boyunca ayni istegi yapmaz.
Bir sunucunun dondurdugu cevap ile beraber gelen headerlardan cevabin cacheleme politikasini belirten headerlardan bizim icin onemli olan iki header ornegi:
Cache-Control: max-age=120
Etag: "57cd451e"
Sunucuya yapilan bir istek client’a ulastiginda client Cache-control headerina bakar ve headerda belirtilen sure boyunca(max-age=120) sunucuya ayni istekde bulunmaz.
120 saniye doldugunda Etag headerinde belirtilen hash ile sunucuya tekrardan
istek yapar. Sunucu eger dosya degistiyse dosyanin kendisini
degismediyse degismedigine dair bilgi gonderir(304 Not Modified).
Eger sunucudan dosyanin degismedigine dair bilgi gelirse bu dosyanin 120 saniye daha kullanilabilecegi anlamina gelir ve tarayici bir 120 saniye daha sunucuya ayni istekte bulunmaz.
Yukaridaki ornekte kafa karistirmasin diye Cache-control headerinda max-age‘i 120 saniye olarak belirtmistim. Bu sure hicde fazla bir sure degil.
Biz sunucumuzdan gonderilen resim, css ve javascript dosyalarini maximum sure cachelenmesini
istiyoruz? Ozaman Cache-control headerimizda belirttigimiz sureyi 100 gun olarak ayarlasak olur mu? Olursa ne olur?
Olur, olursa cokta guzel olur ama bir statik dosyayi 100 gun cachelemenin bazi dez avantajlari var.
Diyelim ki statik dosyalarimizi client’a gonderirken bu dosyalari 100 gun cacheleyebilirsin dedik. Daha sonra siteyi ziyaret eden kullanicilarimiz siteyi ziyaret etti ve statik dosyalarimizi indirdiler.
Daha sonra bir sayfamizin mobilde duzgun gorunmedigini farkettik ve duzeltip degisikligi yayina aldik.
Artik sitemizi ilk defa ziyaret eden kullanicilar css dosyamizin yeni halini indirecegi
icin onlarda site duzgun gorunecek ama biz hatayi duzeltmeden once sitemizi ziyaret eden kisiler sitemizi tekrar ziyaret etse bile sitemiz duzgun gorunmeyecektir
cunku css dosyamizi client a gonderirken 100 gun cachelenebilir olarak belirttik.
Biz ne kadar sitedeki hatayi cozmus olsakta css dosyamizin uzerinde 100 gun gecmeden
veyada kullanicilarimiz tarayicilarinin cacheini temizlemeden css dosyamizin yeni verisyonunu
almayacaklar. Cache max-age ini bir gun gibi bir sure olarak ta belirtebiliriz ama bunun sonucunda sunucularimiza fazla istek gelmeye baslayacak buda performans ve para kaybi demek. Ayrica bir gunluk max-age bile versek bir gun icinde dosya iki defa degisebilir.
Peki hem statik dosyalarimizin client-side’da en uzun sure cachelenebilmesini hemde statik dosyalarimizda degisiklik olunca clientlarin dosyanin yeni veriyonunu indirmelerini nasil saglayabiliriz?
Bu sorunun cevabini ise suradan okuyabilirsiniz.