HTML5 Application Cache nedir? nasıl kullanılır?

0

HTML5 Application Cache nedir? nasıl kullanılır?

HTML5 Application Cache yapmanın faydaları nelerdir?

HTML5 Application Cache kullanmamız projemize hız olarak katkısı olucak mıdır?

HTML5 Application Cache kullanmak uygulamalarımızın yük dağılımına etkisi var mıdır?

 

ergin ergin (2515)
7 yıl önce sordu

    Toplam 1 Cevap


    0

    HTML5 Application Cache web tabanlı uygulamalarda çok sık kullanılmaya başlanan Cache’lemenin önemi gün geçtikçe giderek artmaktadır. Bunun nedeni ise, mobil cihazlardaki kısıtlı internet imkanıdır. Cache mekanizması ile site kullanıcılarının offline olduğu durumlarda da sitenin belirli içeriğine erişmesini sağlamış olacağız. Cache’leme, daha önce yapılıyordu fakat HTML5 ile Application Cache mekanizma kadar hızlı ve güvenilir değildi.

    HTML5 Application Cache kullanabilmek için bir Manifest dosyası oluşturarak kodlarımızı/dosyalarımızı Cache'letebiliriz. Dosyaların Cache'lenmesi kullanıcılara çok iyi bir hız deneyimi yaşatmaktadır. Server tarafında ki yük ise fazlasıyla düşmektedir. Çünkü kullanıcı sadece güncellenen/eklenen verileri çekecektir.

    HTML5 Application Cache gelişmiş tarayıcıların hepsi tarafından desteklenmektedir. Explorer 10 hariç diğer explorer sürümlerinde destek bulunmamaktadır.

    HTML5 Application Cache dökümanımızdaki html elemanı içine Manifest özniteliği ekleyerek Application Cache'i kullanabilir duruma getiririz.

    <!DOCTYPE html>
    <html manifest="uzmanim.appcache">
        <body>
            Döküman içeriğimiz.
        </body>
    </html>

     

    Manifest dosyasının içeriğini oluşturmak

    HTML5 Application Cache ile cache'leme yapacağımız dosyaların bildirimini yapacağımız Manifest dosyamız CACHE MANIFEST ifadesi ile başlamalıdır. Bu başlangıcın ardından gelecek olan içerik 3 bölümünden oluşmaktadır.

    1. CACHE : Bu bölüm tarayıcıya hangi dosyaların çevrim dışı kullanılmak üzere belleğe yerleştirmesi gerektiğini belirttiğimiz yerdir.
     

    CACHE:
    css/layout.css
    css/uzmanim.css
    img/logo.png
    js/jquery.js
    index.html
    cevrimDisi.html

    Bellek bildirim dosyaları içinde herhangi bir başlık altında olmayan ifadeler CACHE bölümündeymiş gibi kabul edilmektedir. Ayrıca # Yorumlar # işaretiyle başlayan satırlara girilebilir.

     

    2. FALLBACK : Bu bölüm çevrimdışıyken ziyaret edilmek istenen sayfaların bellekte mevcut olmamaları halinde görüntülenecek alternatif sayfa veya sayfaların belirlenmesi için kullanılır. Mesela, aşağıdaki / /çevrimDisi.html ifadesi bellekte bulunmayan herhangi bir sayfanın istenmesi halinde çevrimDisi.html sayfasının gösterilmesini sağlamaktadır.

    FALLBACK:
    /cevrimDisi.html

    bellekte dosya yoksa /çevrimDisi.html sayfası gösterilecektir.

     

    3. NETWORK : Bu bölümde de mutlak suretle sunucudan okunması gereken dosyaların bildirimi yapılmaktadır. Burada listelenen dosyalar internet bağlantısı mevcut olsun olmasın bellekten değil sunucudan talep edilecektir. Bağlantı mevcut değilse FALLBACK bölümünde ilgili sayfa için tanımlanan alternatif sayfa ya da hata sayfası görüntülenecektir.

    NETWORK:
    kayit.aspx
    oturum.aspx

     

    Bir projemizde Manifest dosyamız nasıl olmalıdır. Bunun için bir örnek vermemiz gerekirse;

    CACHE MANIFEST
    # versiyon 1.2
    
    CACHE:
    css/ana.css
    grafik/logo.png
    js/jquery.js
    js/main.js
    index.html
    bilgi.html
    makaleler.html
    makaleler/makale1.html
    makaleler/makale2.html
    offline.html
    
    FALLBACK:
    / offline.html
    / hata.html
    
    NETWORK:
    oturum.html
    kayit.html

     

     

    ergin ergin (2515)
    7 yıl önce cevaplandı

      üyelik gerektirir

      Cevap yazabilmek için üye girişi yapmalısınız.

      Eğer uzmanim.net üyesiyseniz giriş yapabilirsiniz: üye girişi yap
      uzmanim.net'e üye olmak çok kolaydır: hemen kayıt ol