Hoş geldin!

Bize kaydolarak, topluluğumuzun diğer üyeleriyle tartışabilecek, paylaşabilecek ve özel mesajlaşabileceksiniz.

Şimdi Kaydol!

Serve static assets with an efficient cache policy nedir?

Serve static assets with an efficient cache policy nedir?
Katılım
31 May 2022
Mesajlar
48
"Serve static assets with an efficient cache policy" ifadesi, web geliştirme ve performans optimizasyonu alanında sıkça kullanılan bir terimdir. Bu ifade, web sitelerinin veya uygulamalarının hızını artırmak için kullanılan bir stratejiyi ifade eder. İşte detaylar:

Web siteleri veya uygulamaları, istemcilerin (tarayıcılar gibi) sunucudan çeşitli dosyaları indirmesine ihtiyaç duyar. Bu dosyalar genellikle "statik varlıklar" olarak adlandırılır ve CSS dosyaları, JavaScript dosyaları, resimler, videolar, fontlar gibi içeriği oluşturan dosyaları içerir.

Bu statik varlıkların her istemde tekrar tekrar sunucudan indirilmesi yerine, "cache" adı verilen bir bellek mekanizması kullanılarak yerel olarak saklanabilirler. Bu sayede, bir istemci belirli bir varlığı bir kez indirdikten sonra, sonraki isteklerde bu varlık yerel önbellekten alınabilir. Bu, yüksek trafiğe sahip sitelerde sunucu yükünü hafifletir ve sayfa yükleme hızını artırır.

Ancak, bu önbellek mekanizması doğru bir şekilde yapılandırılmalıdır. İşte "efficient cache policy" (verimli önbellek politikası) kavramının anlamı burada devreye girer. Bir verimli önbellek politikası şunları içerebilir:

Cache Süresi (Cache Lifespan): Bir dosyanın ne kadar süreyle önbellekte tutulacağını belirlemek önemlidir. Bu süre, dosyanın güncellenme sıklığına ve değişebilirliğine bağlı olarak belirlenmelidir. Örneğin, CSS veya JavaScript dosyaları daha seyrek güncelleniyorsa uzun bir önbellek süresi kullanılabilir, ancak sık güncellenen dosyalar daha kısa bir önbellek süresine sahip olmalıdır.

HTTP Cache Kontrol Başlıkları: Sunucu, HTTP başlıkları aracılığıyla istemcilere dosyanın ne kadar süreyle önbellekte tutulması gerektiğini iletebilir. Cache-Control ve Expires başlıkları bu amaçla kullanılır. Örneğin, Cache-Control: max-age=3600 ifadesi, ilgili varlığın 3600 saniye (1 saat) boyunca önbellekte kalması gerektiğini belirtir.

Etag ve Last-Modified Başlıkları: Bu başlıklar, dosyanın içeriğindeki değişiklikleri takip etmek ve sadece dosya güncellendiğinde önbelleğin yenilenmesini sağlamak için kullanılır. Bu sayede, istemciler sadece değişen dosyaları yeniden indirir.

Önbelleği Engelleme (Cache Busting): Yeni bir dosya sürümü yayınladığınızda, tarayıcıların eski önbelleği kullanmasını engellemek için dosya isimlerine veya yollarına özel sürüm kimlikleri eklemek yaygın bir yöntemdir. Örneğin, styles.css?v=2 gibi.

CDN Kullanımı: İçerik Dağıtım Ağı (CDN), dünya genelinde dağıtılmış sunucu ağları aracılığıyla içeriği sunmanıza yardımcı olur. CDN, daha hızlı yükleme süreleri ve daha iyi önbellekleme performansı sağlayabilir.

Bu faktörler bir araya geldiğinde, "serve static assets with an efficient cache policy" ifadesi, statik varlıkların (CSS, JavaScript, resimler vb.) hızlı ve etkili bir şekilde önbelleklendiği, gereksiz ağ trafiği ve sunucu yükünün azaltıldığı bir performans stratejisini ifade eder. Bu, web sitelerinin daha hızlı ve daha düzgün bir şekilde çalışmasına yardımcı olabilir.

Statik varlıklar verimli bir önbellek politikası ile nasıl sunulur?

Etkili bir önbellek politikası oluşturmak için, statik varlıklarınızı sunmak için kullanılan web sunucusuna bağlı olarak aşağıdaki talimatları izleyin:

Apache sunucuları için

Aşağıdaki kodu kopyalayın ve .htaccess dosyanıza yapıştırın.

<IfModule mod_expires.c>
ExpiresActive On

# Images
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"

# Video
ExpiresByType video/webm "access plus 1 year"
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"

# Fonts
ExpiresByType font/ttf "access plus 1 year"
ExpiresByType font/otf "access plus 1 year"
ExpiresByType font/woff "access plus 1 year"
ExpiresByType font/woff2 "access plus 1 year"
ExpiresByType application/font-woff "access plus 1 year"

# CSS, JavaScript
ExpiresByType text/css "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"

# Others
ExpiresByType application/pdf "access plus 1 year"
ExpiresByType image/vnd.microsoft.icon "access plus 1 year"
</IfModule>


Diğer sunucular için

Diğer sunucu türlerinde tarayıcı önbelleğinin nasıl kurulacağını öğrenmek için aşağıdaki kılavuzları okuyun:

 
Geri
Üst