Site Hızı 2.Bölüm – Expires-Header uygulaması
Bi önceki site hızı bölümünde sizlere küçük yazılımlardan bahsetmiştim, bu yazılımlarla amacımız sitede bulunan resimleri optimize edip dosya boyutlarını küçülterek sayfa açılım hızını artırmak dı, bu bölümde daha karmaşık olan Expires-Header uygulamsından bahsetmek istiyorum.
Tarayıcı Önbelleği – (Leverage browser caching)
Google Page Speed eklentisi ile sitenizi analiz ederken çoğunuzda muhtemelen “Leverage browser caching” bölümünde kırmızı nokta olacaktır. Bu hata tam olarak tarayıcı önbelleği optimal olarak ayarlı olmadığı anlamına gelmektedir. Peki böyle bir tarayıcı önbelleğini optimal olarak nasıl optimize ederiz? Bu ayarı yapmadan önce tarayıcı önebelleği tam olarak nasıl çalışıyor bundan bahsetmek istiyorum.
Tarayıcı Önbelleği çalışma mantığı
Bir website ziyaret edildiğinde kullanıcının tarayıcısı bu siteye ait verileri tarayıcı önbelleğine kayıt ediyor. Bu aynı kullanıcı siteyi tekrar ziyaret ettiğinde, tarayıcı sitenin serverine bu verilerde bir değişiklik olup olmadığını soruyor. Eğer bir değişiklik var ise kullanıcının tarayıcısı sitenin verilerini tekrar indirmek için istekte bulunuyor. Eğer bir değişiklik olmadıysa bu verileri tarayıcının önbelleğinden alıyor. Bu işlem tabiki daha çabuk gelişiyor çünkü veriler zaten kullanıcının bilgisayarında ve tekrar indirmesine gerek kalmıyor.
İlk başta optimal çözüm gibi görünüyor. Ama verilerin yeni olup olmadığını sorarken de belli bir süre geçiyor. Bir adet veri için bu çok fazla değil ama bir sayfa çağırılırken çoğu zaman 10 – 20 veriden oluşuyor, mesela logo, favicon, resimler, css ve js dosyaları gibi biçok veri geliyor. Her bir veride tarayıcı servere soruyor “bu veride bir değişiklik varmı?”. Sadece bu sorguların zaman dilimini toplamış olsak sayfa açılım süresinin 2 – 3 saniye daha geç açılacağını hesaplayabiliriz.
Doğru zamanı ayarlamak
Bu sorgulama işlemini nasıl önleyebiliriz? Sorgulama işlemini yapmana gerek yok komutunu servere ekleyerek sorgulama işlemini önleyebiliriz. Bunu Expires-Header uygulamasını kullanarak yapıyoruz. Expires-Header ile hangi süre zarfında bu sorgulamayı yapıp yapmamasını tarayıcıya söyleyebiliyoruz. Expires-Header uygulamasında süreyi dosya türüne göre farklı zaman dilimine ayarlayarak vermek mümkün.
Bu işlemi yapmadan önce biraz kafa yormakda fayda var, eğer önemli bir css dosyanız varsa ve bu dosyada daha sıklıkla değişiklik yapılıyorsa bunun süresini daha düşük tutmakda fayda var çünkü değişiklik yaptığınız css dosyasını ancak süresi dolduğunda tekrar alacaktır. Resimlerde bu biraz farklı, siteye birkere resmi eklediğinizde bu alanda bir değişiklik yapma olasılığı daha düşük olduğu için resim dosya türlerine vereceğiniz sorgulama süresini daha yüksek tutabilirsiniz.
Komutu .htaccess dosyasına eklemek
Önbilgi verdikten sonra artık pratiğe geçelim bu kadar uzun tutmak istemezdim ama gerekli olduğunu düşünüyorum. Expires-Header uygulamasını yapmak isterseniz .htaccess dosyasına aşağıdaki komutları girmeniz gerekiyor.
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 1 week"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
</IfModule>
İlk satırda olan IF sorgusu Apache mod_expires.c modülünün mevcut olup olmadığını kontrol ediyor. Mevcut durumunda modülü etkinleştiriyor ve herbir dosya türü için zaman dilimlerini ayarlıyor.
Örneğin: aşağıdaki komutta kullanıcının tarayıcısı ilk siteyi ziyaret ettiğinde css dosyasını önbelleğe indiriyor ve 1 haftalık süreside başlamış oluyor. Ancak bir hafta dolduğunda css dosyasını tekrar indirebilecek.
‘ExpiresByType text/css “access plus 1 week”
Peki bu .htaccess dosyasını nerde bulabiliriz?
.htaccess dosyasını sitenizin ana klasörü yani root klasöründe bulabilirsiniz. FTP programı ile root klasörünüze bağlandıktan sonra .htaccess dosyasına sağ tıklayın ve daha sonra Göster/Düzenle ye tıklayın bilgisayarınızda notpad dosyasında açılacaktır burdan değişiklikleri yaptıkdan sonra kayıt edip klasörü kapatın… Hepsi bukadar.
Çok yakında Site Hızı bölümlerine ait yazılarım içinde videoları hazırlayıp eklicem.
Benzer konular:
verdiğin bilgiler çok önemli ve akıcı anlatımla yazmışsınız ..
Başarılarınızın ve makalelerinizin devamını dilerim.
Güvenilir bir kaynaksınız, teşekkür ederim.
Ben teşekkür ederim…
süper yazı eline salık.
teşekkürler mehmet bey
Çok güzel ve faydalı bir paylaşım, ellerine sağlık.
anlattıklarınızı asp bir sistemde uygulamak mümkün mü?
htaccess kullanmadan
Merhaba Tusubasa, asp ile pek bilgim yok maalesef. Fakat asp ile hız çalışmaları eminim mevcuttur… saygılarımla
Merhaba;
Page speed testlerine tek problem expires-headerdı.
htaccessi düzenledikten sonra localde 94 gibi bir puana ulaştım ancak web hostingimi güncellediğimde aynı başarıya ulaşamadım.
Web hostingin apache serverında bunun desteklenmesi sanırım.
Asıl sorum şu, htaccess uzerinde yaptıgım bu değişiklik daha sonra kayboluyor, açık baktığımda yazdıgım expires satırlarının gittiğini görüyorum. Bir yerde yanlışlık yapıyor olabilirmiyim?
Teşekkürler
Merhaba Ender bey,
bir önceki sorunuza yanıt vermek yerine siteniz ile ilgili karşılaştığım soruna çözüm vermek daha doğru olacağını düşünmüştüm. Şimdi sorularınızı cevaplamaya çalışacağım…
Bir önceki sorunuzda JSleri sıkıştırma konusunda sizi şimdi bulunduğunuz yazı dizisine yönlendirecektim. Tüm benzer konuları okuyarak sıkıştırma işlemlerini manuel olarak yapmakta fayda var. htacces dosyası üzerinde eklemiş olduğunuz kod daha sonra kayboluyorsa yapmanız gereken kontrol FTP ile bağlanıp htaccess dosyasına sağ tıklayıp dosya izinlerini 777 olarak ayarlayıp kaydedin ve tekrar kodu ekleyin. artık dosya yazılır duruma gelmiş olacaktır… saygılarıma
bu dosya site içersinde ki image css js dosyalarını klasorlerını vs silermi acaba belli bir süre sonra ?? böle bir zararı olabilir mi
Merhaba, hayır silmez bu işlem sonrasında ziyaretçi sitenize geldiğinde sitenizin tüm dosyalarını bilgisayarına indirir bir sonraki ziyaretinde tekrar dosyaları indirmesine gerek kalmadan bilgisayarında bulunan dosyaları kullanır, yani hiç bir şekilde silme işlemi gerçekleşmez… saygılarımla