HTML5 Uygulama Önbelleği

Uygulama önbelleği kullanılarak, cache manifest dosyası oluşturarak web uygulamanın çevrimdışı sürümünü kolayca oluşturabilirsiniz.

Uygulama önbelleği nedir?

HTML5, Uygulama Önbelleği'ni (Application Cache) getirdi, bu da web uygulamalarının önbelleğe alınabileceği ve İnternet bağlantısı olmadan erişilebileceği anlamına gelir.

Uygulama önbelleği, uygulamaya üç avantaj getirir:

  1. Çevrimdışı tarayıcı - Kullanıcılar uygulama çevrimdışıyken bunları kullanabilir
  2. Hız - Önbelleğe alınmış kaynaklar daha hızlı yüklenir
  3. Sunucu yükleme yükünü azaltma - Tarayıcı yalnızca güncellenmiş veya değiştirilmiş kaynakları sunucudan indirir

Tarayıcı Desteği

Tablodaki numaralar, tam olarak uygulama önbelleğini destekleyen ilk tarayıcı sürümünü gösterir.

API
Uygulama Önbelleği 4.0 10.0 3.5 4.0 11.5

HTML Cache Manifest Örneği

Aşağıdaki örnek, cache manifest içeren bir HTML belgesini (çevrimdışı görüntüleme için) gösterir:

Örnek

!DOCTYPE HTML
<html manifest="demo.appcache">
<body>
Belge içeriği ...
</body>
</html>

Kişisel olarak deneyin

Cache Manifest Temel

Uygulama önbelleğini etkinleştirmek için, belgenin <html> etiketine manifest özelliğini ekleyin:

!DOCTYPE HTML
<html manifest="demo.appcache">
...
</html>

Her manifest belirtilmiş sayfa, kullanıcıya eriştiğinde önbelleğe alınır. Manifest özelliği belirtilmemişse, sayfa önbelleğe alınmaz (manifest dosyasında doğrudan belirtilmemişse bile).

Manifest dosyasının önerilen dosya uzantısı: " .appcache".

Dikkat:Manifest dosyası doğru MIME-type'ı ayarlamak zorundadır, yani "text/cache-manifest". Web sunucusunda yapılandırılmalıdır.

Manifest Dosyası

Manifest dosyası basit bir metin dosyasıdır ve tarayıcının önbelleğe alınan içeriği (ve önbelleğe alınmayan içeriği) belirtir.

Manifest dosyası üç bölümden oluşur:

  • CACHE MANIFEST - Bu başlık altında belirtilen dosyalar ilk indirildikten sonra önbelleğe alınır
  • NETWORK - Bu başlık altında belirtilen dosyalar sunucuya bağlantı gerektirir ve önbelleğe alınmaz
  • FALLBACK - Bu başlık altında belirtilen dosyalar, sayfa erişilemez olduğunda (örneğin 404 sayfası) geri dönüş sayfalarını (örneğin 404 sayfası) belirtir

CACHE MANIFEST

İlk satır, CACHE MANIFEST, gereklidir:

CACHE MANIFEST
/theme.css
/logo.gif
/main.js

Yukarıdaki manifest dosyası üç kaynak listeler: bir CSS dosyası, bir GIF görseli ve bir JavaScript dosyası. Manifest dosyası yüklendikten sonra, tarayıcı bu üç dosyayı web sitesinin kök dizininden indirir. Sonra, kullanıcı ne zaman İnternet'ten bağlantıyı keserse, bu kaynaklar hala kullanılabilir olacaktır.

NETWORK

Aşağıdaki NETWORK bölümü, dosya "login.php"in her zaman önbelleğe alınmayacağını ve çevrimdışı olunca kullanılamayacağını belirtir:

NETWORK:
login.asp

Tüm diğer kaynaklar/dosyaların İnternet bağlantısı gerektiğini belirtmek için yıldız işareti kullanılabilir:

NETWORK:
*
FALLBACK

Aşağıdaki FALLBACK bölümü, İnternet bağlantısı kurulamadığında /html/ dizinindeki tüm dosyaların "offline.html" ile değiştirilmesini sağlar:

FALLBACK:
/html/ /offline.html

Not:İlk URI kaynak, ikincisi ise alternatiftir.

Önbelleği güncelle

Uygulama önbelleğe alındıktan sonra, aşağıdaki durumlardan birinden biri gerçekleşene kadar önbellekte kalır:

  • Kullanıcı tarayıcı önbelleğini temizler
  • manifest dosyası değiştirildi (aşağıdaki ipuçlarına bakın)
  • Uygulama önbelleğini programla güncelle

Örnek - Tamamı Cache Manifest Dosyası

CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html/ /offline.html

İpucu:="#" ile başlayanlar yorum satırlarıdır, ancak diğer amaçlar için de kullanılabilir. Uygulama önbelleği sadece manifest dosyası değiştiğinde güncellenir. Bir resmi düzenlediğinizde veya bir JavaScript fonksiyonunu değiştirdiğinizde bu değişiklikler yeniden önbelleğe alınmaz. Tarih ve sürüm numaralarını güncellemek, tarayıcının dosyaları yeniden önbelleğe almasını sağlamak için bir yöntemdir.

Uygulama önbelleği hakkında dikkat edilmesi gerekenler

Önbelleğe alınan içeriklere dikkat edin.

Bir dosya önbelleğe alındıktan sonra, tarayıcı önbelleğe alınan sürümü göstermeye devam eder, bu yüzden dosyayı sunucuda değiştirdiyseniz. Tarayıcının önbelleği güncellemek için manifest dosyasını güncellemeniz gerekecek.

Not:Tarayıcıların önbelleğe alınan veri kapasitesi sınırları farklı olabilir (bazı tarayıcıların sınırları her site için 5MB'dir).