Tarayıcı Önbellekleme Nasıl Yapılır?

Tarayıcı önbellekleme, tarayıcı tarafından indirilen dosyaları geçici bir depolama alanı yaratarak web sitenin daha hızlı ve verimli bir şekilde yüklenmesini sağlar. Siteye ilk defa giren kullanıcı için normal şekilde dosya yükleme işlemi olacaktır fakat kullanıcı sitenize daha sonrada girdiği takdirde dosyalarınız depolama alanında bulunduğu için direkt olarak yüklenecektir, tekrar indirilmeyecektir. Bu da kullanıcının daha az dosya indirmesi ve sunucuya daha az istek gitmesine neden olduğu için web sitesi daha hızlı bir şekilde açılır hale gelecektir.

Peki, bu işlemi nasıl yaparız?

AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/json
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml

AddType font/opentype .otf
AddType application/font-woff .woff
AddType application/font-woff2 .woff2
AddType application/x-font-ttf .ttf
AddType application/vnd.ms-fontobject .eot
AddType image/svg+xml .svg

ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType application/javascript "access plus 6 months"
ExpiresByType application/vnd.ms-fontobject "access plus 6 months"
ExpiresByType application/xhtml+xml "access plus 10 minutes"
ExpiresByType application/x-javascript "access plus 6 months"
ExpiresByType application/x-shockwave-flash "access plus 6 months"
ExpiresByType application/x-woff "access plus 6 months"
ExpiresByType application/x-woff2 "access plus 6 months"
ExpiresByType font/otf "access plus 6 months"
ExpiresByType font/ttf "access plus 6 months"
ExpiresByType image/gif "access plus 6 months"
ExpiresByType image/jpeg "access plus 6 months"
ExpiresByType image/png "access plus 6 months"
ExpiresByType image/svg+xml "access plus 6 months"
ExpiresByType image/x-icon "access plus 6 months"
ExpiresByType text/css "access plus 6 months"
ExpiresByType text/html "access plus 10 minutes"
ExpiresByType text/javascript "access plus 6 months"
ExpiresByType video/x-flv "access plus 6 months"

Header set Cache-Control "max-age=14515200, public"
Header set Cache-Control "max-age=14515200, public"
Header set Cache-Control "max-age=14515200, public"
Header set Cache-Control "max-age=14515200, public"

Bu kodu .htaccess dosyasına eklemeniz gerekmektedir.

Yukarıdaki kod ile CSS ve Javascript gibi dosyaları 6 ay, sayfanızın HTML’si gibi hızla yenilenen dosyaları ise 10 dakika, görselleri ise 6 ay sonra sona erecek şekilde ayarladık.

Eğer css ve js dosyalarında bir değişiklik yaptıysanız önbelleği temizleyerek kontrol sağlayabilirsiniz.