Kalıcı Depolama API'si: Web Uygulamaları için Depolama Kotasını Anlama ve Yönetme

Kalıcı Depolama API'si, web geliştiricilerine kullanıcının tarayıcısında depolama kotası talep etmek ve yönetmek için standartlaştırılmış bir yol sunar. Genellikle boyut olarak sınırlı olan ve otomatik olarak temizlenmeye tabi olan çerezler veya localStorage gibi geleneksel depolama mekanizmalarının aksine, Kalıcı Depolama API'si uygulamaların daha büyük miktarlarda depolama alanı talep etmesine ve en önemlisi, depolamanın kalıcı olmasını istemesine olanak tanır – bu da tarayıcının depolama baskısı altında bile verileri otomatik olarak temizlemeyeceği anlamına gelir.

Kalıcı Depolama Neden Önemlidir?

İlerici Web Uygulamalarının (PWA) giderek yaygınlaştığı ve kullanıcıların zengin, çevrimdışı deneyimler beklediği günümüz web dünyasında, güvenilir depolama esastır. Şu senaryoları göz önünde bulundurun:

• Belgelere Çevrimdışı Erişim: Bir belge düzenleme uygulaması (Google Dokümanlar gibi), kullanıcıların internet bağlantısı olmasa bile çalışmaya devam edebilmesi için belgeleri yerel olarak depolamalıdır.
• Medya Oynatma: Spotify veya Netflix gibi yayın hizmetleri, kullanıcıların çevrimdışı oynatma için içerik indirmesine olanak tanır ve bu da önemli miktarda depolama alanı gerektirir.
• Oyun Verileri: Çevrimiçi oyunlar, akıcı ve duyarlı bir deneyim sağlamak için genellikle kullanıcı ilerlemesini, seviyeleri ve varlıkları yerel olarak depolar.
• Büyük Veri Kümelerini Önbelleğe Alma: Haritalama uygulamaları (ör. Google Haritalar, OpenStreetMap tabanlı uygulamalar) gibi büyük veri kümeleriyle çalışan uygulamalar, ağ isteklerini azaltmak ve performansı artırmak için verileri yerel olarak önbelleğe almaktan faydalanır.
• Yerel Veri İşleme: Yoğun veri işleme yapan web uygulamaları (ör. resim düzenleme, video düzenleme), tekrarlanan hesaplamalardan kaçınmak için ara sonuçları yerel olarak saklayabilir.

Kalıcı depolama olmadan, cihazda alan azaldığında tarayıcı bu uygulamalar tarafından kullanılan depolama alanını otomatik olarak temizleyebilir, bu da sinir bozucu bir kullanıcı deneyimine ve potansiyel veri kaybına yol açar. Kalıcı Depolama API'si, uygulamaların kalıcı depolama talep etmesi ve depolama kullanımını izlemesi için bir mekanizma sağlayarak bu sorunu çözer.

Depolama Kotasını Anlama

Her tarayıcı, her bir origin'e (alan adına) belirli miktarda depolama alanı ayırır. Bu depolama kotası sabit değildir ve cihazın toplam depolama kapasitesi, mevcut boş alan miktarı ve kullanıcının tarayıcı ayarları gibi faktörlere bağlı olarak değişebilir. Storage API, mevcut depolama kotasını ve halihazırda kullanılan depolama miktarını sorgulamak için yöntemler sunar.

Depolama Kotasını Sorgulama

navigator.storage arayüzü, depolamayla ilgili bilgilere erişim sağlar. Mevcut depolama kotası ve uygulamanız tarafından kullanılan depolama miktarı hakkında bir tahmin almak için estimate() yöntemini kullanabilirsiniz. Dönen nesne, her ikisi de bayt cinsinden ölçülen usage ve quota özelliklerini içerir.

            
async function getStorageEstimate() {
  if (navigator.storage && navigator.storage.estimate) {
    const estimate = await navigator.storage.estimate();
    console.log(`Usage: ${estimate.usage}`);
    console.log(`Quota: ${estimate.quota}`);
    console.log(`Percentage used: ${(estimate.usage / estimate.quota * 100).toFixed(2)}%`);
  } else {
    console.warn("Storage estimate API not supported.");
  }
}

getStorageEstimate();

            

              
                Copy
              
            
          

Örnek: Diyelim ki estimate.usage 10485760 (10MB) ve estimate.quota 1073741824 (1GB) döndürdü. Bu, uygulamanızın 1GB'lık kotasının 10MB'ını kullandığını gösterir, bu da mevcut depolama alanının yaklaşık %1'idir.

Kota Değerlerini Yorumlama

quota değeri, uygulamanızın kullanabileceği *maksimum* depolama miktarını temsil eder. Ancak, bu kotanın garanti edilmediğini anlamak önemlidir. Cihazda depolama alanı azalıyorsa veya kullanıcı tarayıcı verilerini temizlerse, tarayıcı kotayı düşürebilir. Bu nedenle, uygulamanız mevcut depolama alanının bildirilen kotadan daha az olduğu durumları ele alacak şekilde tasarlanmalıdır.

En İyi Uygulama: Depolama kullanımını izlemek için bir mekanizma uygulayın ve uygulama depolama sınırına yaklaşıyorsa kullanıcıyı proaktif olarak bilgilendirin. Kullanıcının gereksiz verileri temizlemesi veya depolama planını yükseltmesi (varsa) için seçenekler sunun.

Kalıcı Depolama Talep Etme

Uygulamanızın yeterli depolama kotası olsa bile, tarayıcı depolama baskısı altında uygulamanızın verilerini yine de otomatik olarak temizleyebilir. Bunu önlemek için, navigator.storage.persist() yöntemini kullanarak kalıcı depolama talep edebilirsiniz.

            
async function requestPersistentStorage() {
  if (navigator.storage && navigator.storage.persist) {
    const isPersistent = await navigator.storage.persist();
    console.log(`Persistent storage granted: ${isPersistent}`);

    if (isPersistent) {
      console.log("Storage will not be cleared automatically.");
    } else {
      console.warn("Persistent storage not granted.");
      // Provide guidance to the user on how to enable persistent storage in their browser.
    }
  } else {
    console.warn("Persistent storage API not supported.");
  }
}

requestPersistentStorage();

            

              
                Copy
              
            
          

persist() yöntemi, kalıcı depolama talebinin kabul edilip edilmediğini belirten bir boolean değeri döndürür. Tarayıcı, kalıcı depolama izni vermeden önce kullanıcıdan izin isteyebilir. Bu istemin tam şekli, tarayıcıya ve kullanıcının ayarlarına bağlı olarak değişecektir.

Kullanıcı Etkileşimi ve İzin

Tarayıcının kalıcı depolama izni verme kararı, aşağıdakiler de dahil olmak üzere çeşitli faktörlere bağlıdır:

• Kullanıcı Etkileşimi: Tarayıcılar, kullanıcının sık sık etkileşimde bulunduğu uygulamalara kalıcı depolama izni verme olasılığı daha yüksektir.
• Kullanıcı Ayarları: Kullanıcılar, kalıcı depolama taleplerinin nasıl ele alınacağını kontrol etmek için tarayıcı ayarlarını yapılandırabilirler. Tüm istekleri otomatik olarak kabul etmeyi, tüm istekleri reddetmeyi veya her istek için bir istem gösterilmesini seçebilirler.
• Mevcut Depolama Alanı: Cihazda depolama alanı kritik derecede düşükse, tarayıcı kullanıcı etkileşimi veya ayarlarına bakılmaksızın kalıcı depolama talebini reddedebilir.
• Origin Güveni: Güvenli bağlamlar (HTTPS), genellikle kalıcı depolama için gereklidir.

Önemli: Kalıcı depolama talebinin her zaman kabul edileceğini varsaymayın. Uygulamanız, depolamanın kalıcı olmadığı durumlara karşı dayanıklı olmalıdır. Verileri bir sunucuya yedeklemek veya veri kaybını zarif bir şekilde ele almak için stratejiler uygulayın.

Mevcut Kalıcılığı Kontrol Etme

Uygulamanızın zaten kalıcı depolama iznine sahip olup olmadığını kontrol etmek için navigator.storage.persisted() yöntemini kullanabilirsiniz.

            
async function checkPersistentStorage() {
  if (navigator.storage && navigator.storage.persisted) {
    const isPersistent = await navigator.storage.persisted();
    console.log(`Persistent storage already granted: ${isPersistent}`);
  } else {
    console.warn("Persistent storage API not supported.");
  }
}

checkPersistentStorage();

            

              
                Copy
              
            
          

Depolama Teknolojileri ve Kota

Kalıcı Depolama API'si, tarayıcıda mevcut olan çeşitli depolama teknolojileriyle etkileşime girer. Bu teknolojilerin kotadan nasıl etkilendiğini anlamak çok önemlidir.

• IndexedDB: İstemci tarafında yapılandırılmış verileri depolamak için güçlü bir NoSQL veritabanıdır. IndexedDB, depolama kotası sınırlamalarına tabidir ve kalıcı depolamadan önemli ölçüde faydalanabilir.
• Cache API: Service worker'lar tarafından ağ isteklerini önbelleğe almak için kullanılır, bu da çevrimdışı erişim ve daha iyi performans sağlar. Cache API aracılığıyla oluşturulan önbellekler de genel depolama kotasına dahil olur.
• localStorage & sessionStorage: Daha küçük miktarlarda veri için basit anahtar-değer depolarıdır. localStorage, varsayılan olarak kalıcı olmasına rağmen (kullanıcı tarayıcı verilerini temizlemediği sürece), boyutu sınırlıdır ve Kalıcı Depolama API'sinin sağladığı kalıcılık garantilerinden IndexedDB veya Cache API kadar yararlanamaz. Ancak, kullanımları yine de genel kotaya dahil edilir.
• Çerezler (Cookies): Teknik olarak bir depolama mekanizması olsalar da, çerezler genellikle büyük miktarda veri depolamaktan ziyade oturum yönetimi ve izleme için kullanılır. Çerezlerin kendi boyut sınırları vardır ve Storage API tarafından yönetilen depolama kotasından farklıdırlar.

Örnek: Bir PWA, kullanıcı profillerini ve çevrimdışı verileri depolamak için IndexedDB'yi, resimler ve JavaScript dosyaları gibi statik varlıkları önbelleğe almak için ise Cache API'yi kullanır. Kalıcı depolama talep etmek, bu önbelleğe alınmış verilerin temizlenme olasılığını azaltarak tutarlı bir çevrimdışı deneyim sağlar.

Depolama Kotası Yönetimi için En İyi Uygulamalar

Etkili depolama kotası yönetimi, sağlam ve kullanıcı dostu web uygulamaları oluşturmak için esastır. İşte takip edilmesi gereken bazı en iyi uygulamalar:

1. Depolama Kullanımını Düzenli Olarak İzleyin

Uygulamanızın depolama kullanımını navigator.storage.estimate() kullanarak periyodik olarak izlemek için bir mekanizma uygulayın. Bu, potansiyel depolama sorunlarını proaktif olarak belirlemenize ve kullanıcı deneyimini etkilemeden önce düzeltici önlem almanıza olanak tanır.

2. Bir Depolama Yönetimi Arayüzü Uygulayın

Kullanıcılara depolama alanlarını yönetmeleri için açık ve sezgisel bir arayüz sunun. Bu arayüz kullanıcıların şunları yapmasına olanak sağlamalıdır:

• Mevcut depolama kullanımlarını görüntüleme.
• En çok depolama alanı tüketen verileri belirleme.
• Gereksiz verileri silme (ör. önbelleğe alınmış dosyalar, indirilmiş içerikler).

Örnek: Bir fotoğraf düzenleme uygulaması, kullanıcılara tek tek fotoğraflar ve albümler tarafından kullanılan depolama alanının dökümünü gösteren bir arayüz sunabilir, bu da artık ihtiyaç duymadıkları fotoğrafları kolayca silmelerine olanak tanır.

3. Veri Depolamayı Optimize Edin

Uygulamanızın veri depolamasını, kapladığı alanı en aza indirecek şekilde optimize edin. Bu şunları içerir:

• Verileri depolamadan önce sıkıştırma.
• Verimli veri formatları kullanma (ör. Protocol Buffers, MessagePack).
• Gereksiz veri depolamaktan kaçınma.
• Eski veya kullanılmayan verileri otomatik olarak silmek için veri son kullanma politikaları uygulama.

4. Zarif Bir Düşüş Stratejisi Uygulayın

Uygulamanızı, depolama alanının sınırlı olduğu veya kalıcı depolama izninin verilmediği durumları zarif bir şekilde ele alacak şekilde tasarlayın. Bu şunları içerebilir:

• Önemli miktarda depolama gerektiren belirli özellikleri devre dışı bırakma.
• Kullanıcıya bir uyarı mesajı gösterme.
• Verileri bir sunucuya yedekleme seçeneği sunma.

5. Kullanıcıları Kalıcı Depolama Hakkında Bilgilendirin

Uygulamanız büyük ölçüde kalıcı depolamaya dayanıyorsa, kullanıcıları kalıcı depolama izni vermenin faydaları hakkında eğitin. Kalıcı depolamanın uygulamanın performansını nasıl iyileştirdiğini ve verilerinin otomatik olarak temizlenmemesini nasıl sağladığını açıklayın.

6. Depolama Hatalarını Zarif Bir Şekilde Ele Alın

Uygulamanız depolama kotasını aştığında ortaya çıkabilecek QuotaExceededError gibi depolama hatalarını ele almaya hazır olun. Kullanıcıya bilgilendirici hata mesajları sunun ve olası çözümler önerin (ör. depolama alanını temizleme, depolama planını yükseltme).

7. Service Worker Kullanmayı Düşünün

Service worker'lar, statik varlıkları ve API yanıtlarını önbelleğe alarak web uygulamanızın çevrimdışı yeteneklerini önemli ölçüde artırabilir. Service worker'ları kullanırken, depolama kotasını göz önünde bulundurun ve önbelleği etkili bir şekilde yönetmek için stratejiler uygulayın.

Uluslararasılaştırma Hususları

Uygulamanızın depolama yönetimi arayüzünü tasarlarken, aşağıdaki uluslararasılaştırma (i18n) hususlarını göz önünde bulundurun:

• Sayı Biçimlendirme: Depolama kullanım değerlerini gösterirken farklı yerel ayarlar için uygun sayı biçimlendirmesini kullanın. Örneğin, bazı yerel ayarlarda ondalık ayırıcı olarak virgül kullanılırken, diğerlerinde nokta kullanılır. Sayıları kullanıcının yerel ayarına göre biçimlendirmek için JavaScript'in toLocaleString() yöntemini kullanın.
• Tarih ve Saat Biçimlendirme: Uygulamanız tarih ve saatleri saklıyorsa, bunları depolama yönetimi arayüzünde gösterirken kullanıcının yerel ayarına göre biçimlendirin. Yerel ayara duyarlı tarih ve saat biçimlendirmesi için JavaScript'in toLocaleDateString() ve toLocaleTimeString() yöntemlerini kullanın.
• Birim Yerelleştirme: Depolama birimlerini (ör. KB, MB, GB) farklı bölgelerde kullanılan geleneklere uyacak şekilde yerelleştirmeyi düşünün. Standart birimler yaygın olarak anlaşılsa da, yerelleştirilmiş alternatifler sunmak kullanıcı deneyimini iyileştirebilir.
• Metin Yönü: Depolama yönetimi arayüzünüzün hem soldan sağa (LTR) hem de sağdan sola (RTL) metin yönlerini desteklediğinden emin olun. Metin yönünü doğru bir şekilde ele almak için direction ve unicode-bidi gibi CSS özelliklerini kullanın.

Güvenlik Hususları

Kalıcı depolama ile uğraşırken güvenlik her şeyden önemlidir. Şu güvenlik en iyi uygulamalarını takip edin:

• HTTPS Kullanın: Aktarımdaki verileri korumak ve ortadaki adam (man-in-the-middle) saldırılarını önlemek için uygulamanızı her zaman HTTPS üzerinden sunun. HTTPS ayrıca birçok tarayıcıda kalıcı depolama için bir gerekliliktir.
• Kullanıcı Girdisini Temizleyin: Siteler arası komut dosyası çalıştırma (XSS) güvenlik açıklarını önlemek için depolamadan önce tüm kullanıcı girdilerini temizleyin.
• Hassas Verileri Şifreleyin: Yetkisiz erişimden korumak için hassas verileri yerel olarak depolamadan önce şifreleyin. Şifreleme için Web Crypto API'sini kullanmayı düşünün.
• Güvenli Veri İşleme Uygulamaları Geliştirin: Veri sızıntılarını önlemek ve depolanan verilerinizin bütünlüğünü sağlamak için güvenli kodlama uygulamalarını takip edin.
• Kodunuzu Düzenli Olarak Gözden Geçirin ve Güncelleyin: En son güvenlik tehditleri ve güvenlik açıkları konusunda güncel kalın ve bunları ele almak için kodunuzu düzenli olarak gözden geçirin ve güncelleyin.

Farklı Bölgelerden Örnekler

Depolama kotası yönetiminin farklı bölgelerde nasıl farklılık gösterebileceğini ele alalım:

• Sınırlı Bant Genişliğine Sahip Bölgeler: Sınırlı veya pahalı internet bant genişliğine sahip bölgelerde, kullanıcılar çevrimdışı erişime ve önbelleğe almaya daha fazla bağımlı olabilir. Bu nedenle, uygulamalar verimli depolama kullanımına öncelik vermeli ve önbelleğe alınmış verilerin yönetimi konusunda net bir rehberlik sağlamalıdır. Örneğin, Afrika'nın veya Güneydoğu Asya'nın bazı bölgelerinde veri maliyetleri önemli bir endişe kaynağıdır.
• Veri Gizliliği Düzenlemelerine Sahip Bölgeler: Avrupa Birliği (GDPR) gibi katı veri gizliliği düzenlemelerine sahip bölgelerde, uygulamalar depolamayı nasıl kullandıkları konusunda şeffaf olmalı ve kişisel verileri depolamadan önce kullanıcılardan açık rıza almalıdır. Ayrıca kullanıcılara verilerine erişme, düzeltme ve silme olanağı da sağlamaları gerekir.
• Daha Eski Cihazlara Sahip Bölgeler: Kullanıcıların daha eski veya daha az güçlü cihazlar kullanma olasılığının daha yüksek olduğu bölgelerde, uygulamalar depolama kullanımına özellikle dikkat etmeli ve cihaz performansı üzerindeki etkiyi en aza indirmek için veri depolamalarını optimize etmelidir.
• Belirli Dil Gereksinimleri Olan Bölgeler: Depolama Yönetimi Arayüzleri, sayı formatları (ör. ondalık ayırıcılar için virgül veya nokta kullanımı), tarih/saat formatları ve uygun metin yönü dikkate alınarak tamamen yerelleştirilmelidir.

Örnek: Hindistan'daki kullanıcıları hedefleyen bir haber uygulaması, kesintili internet bağlantısı potansiyelini göz önünde bulundurarak kullanıcıların çevrimdışı okumak için haber makaleleri indirmesine izin verebilir. Uygulama ayrıca, kullanıcıların yer açmak için indirilen makaleleri kolayca silmelerine olanak tanıyan, birden çok Hint dilinde açık bir depolama yönetimi arayüzü sunacaktır.

Depolama API'lerinin Geleceği

Kalıcı Depolama API'si sürekli olarak gelişmektedir ve modern web uygulamalarının artan taleplerini karşılamak için yeni özellikler ve yetenekler eklenmektedir. Bazı potansiyel gelecekteki gelişmeler şunları içerir:

• Geliştirilmiş Depolama Kotası Yönetimi: Depolama kotası üzerinde daha ayrıntılı kontrol, uygulamaların farklı veri türlerine belirli miktarlarda depolama alanı ayırmasına olanak tanır.
• Bulut Depolama ile Entegrasyon: Bulut depolama hizmetleriyle sorunsuz entegrasyon, uygulamaların yerel depolama sınırlı olduğunda verileri şeffaf bir şekilde bulutta depolamasına olanak tanır.
• Gelişmiş Veri Senkronizasyonu: Uygulamaların yerel depolama ve bulut arasında verileri verimli bir şekilde senkronize etmesini sağlayan daha gelişmiş veri senkronizasyon mekanizmaları.
• Standartlaştırılmış Depolama Şifrelemesi: Yerel depolamada saklanan verileri şifrelemek için standartlaştırılmış bir API, hassas verileri güvence altına alma sürecini basitleştirir.

Sonuç

Kalıcı Depolama API'si, zengin çevrimdışı deneyimler sunabilen sağlam ve kullanıcı dostu web uygulamaları oluşturmak isteyen web geliştiricileri için güçlü bir araçtır. Depolama kotası yönetimini anlayarak, kalıcı depolama talep ederek ve veri depolama ve güvenlik için en iyi uygulamaları takip ederek, güvenilir, performanslı ve kullanıcı gizliliğine saygılı uygulamalar oluşturabilirsiniz. Web geliştikçe, Kalıcı Depolama API'si yeni nesil web uygulamalarını mümkün kılmada giderek daha önemli bir rol oynayacaktır.

İleri Okuma

• MDN Web Docs: Storage API
• web.dev: Storage for the web
• WICG: Storage Quota API