localStorage ve sessionStorage Karşılaştırması

Web Depolama API'si, istemci tarafında iki anahtar-değer deposu sağlar: localStorage (oturumlar arasında kalıcıdır) ve sessionStorage (sekme kapatıldığında temizlenir). Her ikisi de dize değerleri depolar ve aynı kaynak üzerinde JavaScript aracılığıyla eşzamanlı olarak erişilebilir.

localStorage içindeki veriler kod, kullanıcı veya tarayıcı verilerinin silinmesiyle açıkça temizlenene kadar kalır. Tarayıcının yeniden başlatılmasından, sayfanın yenilenmesinden ve sekmenin kapatılmasından etkilenmez. Kapasite, tarayıcıya bağlı olarak genellikle kaynak başına 5-10 MB'tır.

sessionStorage, geçerli tarayıcı sekmesi ve oturumuyla sınırlıdır. Aynı sekmede sayfa yenilense bile veriler korunur; ancak sekme kapatıldığında temizlenir. Aynı siteye açılan iki sekmenin sessionStorage alanları ayrıdır ve yalıtılmıştır; verileri paylaşmazlar.

Her iki depolama alanı da aynı API'yi paylaşır: setItem(key, value), getItem(key), removeItem(key), clear() ve length özelliği. Aynı kod her ikisiyle de çalışır; yalnızca localStorage yerine sessionStorage kullanın veya bunun tersini yapın.

Şunlar için localStorage kullanın: kullanıcı tercihleri (tema, dil), önbelleğe alınmış API yanıtları ve beni hatırla işlevi. Şunlar için sessionStorage kullanın: sihirbaz veya form adımının durumu, ödeme öncesindeki geçici alışveriş sepeti ve gizlilik nedeniyle ziyaretler arasında kalıcı olmaması gereken veriler.

Her iki depolama alanı da kesin olarak kaynak kapsamındadır (protokol + ana bilgisayar + bağlantı noktası). https://example.com, http://example.com tarafından ayarlanan localStorage verilerini okuyamaz. Bu bir güvenlik sınırıdır; document.domain üzerinde değişiklik yapılmadıkça (kullanımdan kaldırılmıştır) alt alan adları da ayrı kaynaklardır.

Çoğu tarayıcıda her iki depolama alanı için kaynak başına yaklaşık 5 MB sınırı vardır. Sınırın aşılması QuotaExceededError hatasına yol açar. Büyük miktarda veri depolama gereksinimleri için gigabaytlarca yapılandırılmış veriyi destekleyen IndexedDB gerekir. Web Depolama, küçük anahtar-değer çiftleri içindir; ikili büyük nesneler veya büyük veri kümeleri için değildir.

Web Depolama okuma ve yazma işlemleri eşzamanlıdır ve ana iş parçacığını engeller. Büyük okuma veya yazma işlemleri takılmalara neden olabilir. Sık gerçekleştirilen büyük veri işlemleri için IndexedDB'yi tercih edin. Performans sorunlarını önlemek için Web Depolama değerlerini küçük tutun ve bu işlemleri seyrek gerçekleştirin.

Web Depolama yalnızca dizeleri saklar. Nesneleri JSON.stringify() ile serileştirin; JSON.parse() ile serileştirmeden çıkarın. Ayrıştırma hatalarını yönetin: try { return JSON.parse(stored) } catch { return defaultValue }. Depolamadaki bozuk veya JSON olmayan değerler ayrıştırma hatalarına yol açar.

Özel veya gizli moddaki localStorage, tüm özel pencereler kapatıldığında temizlenir ve sessionStorage gibi davranır. Kimlik doğrulama durumunu localStorage'a bağlı tutan kod, localStorage'ın beklenmedik şekilde silinmesi durumunu ele almalıdır.

Tarayıcılar üçüncü taraf depolama erişimini giderek daha fazla kısıtlamaktadır. first-party.com üzerindeki üçüncü taraf bir iframe, third-party.com alanının localStorage'ına erişemez. Safari'nin ITP'si ve Firefox'un Gelişmiş İzleme Koruması depolama alanını bölümlere ayırır; birinci taraf kullanımı bundan etkilenmez.

sessionStorage ne zaman temizlenir?

localStorage, program aracılığıyla veya kullanıcı tarafından temizlenene kadar süresiz olarak kalır; sessionStorage ise sekme kapatıldığında temizlenir. Her ikisi de kaynak kapsamındaki, eşzamanlı çalışan ve yaklaşık 5 MB kapasiteye sahip dize anahtar-değer depolarıdır. Tercihler ve kalıcı durum için localStorage'ı; geçici, oturum kapsamındaki ve sekme kapatıldığında korunmaması gereken durumlar için sessionStorage'ı kullanın.