LocalStorage vs SessionStorage
Bu yazımızda LocalStorage ve SessionStorage hakkında konuşacağız. Her iki depolama yöntemi de web sayfalarında kullanıcıların verilerini tarayıcı tarafında saklamak için kullanılır. Her iki depolama şeklide Web Storage API’nin bir parçasıdır ve Javascript ile beraber kolaylıkla kullanılır.
LocalStorage
LocalStorage, kullanıcıların verilerini tarayıcı tarafında saklamak için kullanılan bir yöntemdir. Veriler tarayıcı kapatılsa bile saklanmaya devam eder ve sadece aynı origin ( kökenden ) gelen sayfalar tarafından erişilebilir. LocalStorage, genellikle kullanıcı tercihleri , oyun skorları , tema seçimleri verileri saklamak için kullanır.
Özellikleri ;
- Tarayıcı kapatıldığında bile veri saklanır.
- Aynı kökenden gelen sayfalar arası paylaşılabilir.
- Yaklaşık 5MB’a kadar veri saklayabilir.
// Veri kaydetme
localStorage.setItem('kullaniciAdi', 'Selim');
// Veri okuma
const kullaniciAdi = localStorage.getItem('kullaniciAdi');
console.log(kullaniciAdi); // Çıktı: Selim
// Veri silme
localStorage.removeItem('kullaniciAdi');
// Tüm verileri silme
localStorage.clear();SessionStorage
SessionStorage’de LocalStorage gibi çalışır yalnız tarayıcıda saklanan veriler tarayıcı sekmesi için geçerlidir. Sekme kapatıldığında veriler silinir. Kullanıcı oturum süresi boyunca verileri saklamak için idealdir.
Özellikleri ;
- Sekme kapatıldığında veriler silinir.
- Veriler, aynı sekme içindeki sayfalar arasında paylaşılabilir.
- Yaklaşık 5MB’a kadar veri saklayabilir.
// Veri kaydetme
sessionStorage.setItem('geciciVeri', '12345');
// Veri okuma
const geciciVeri = sessionStorage.getItem('geciciVeri');
console.log(geciciVeri); // Çıktı: 12345
// Veri silme
sessionStorage.removeItem('geciciVeri');
// Tüm verileri silme
sessionStorage.clear();Aralarındaki Farklar
- Süreklilik: LocalStorage’da saklanan veriler, tarayıcı kapatılsa bile kalırken, SessionStorage’daki veriler tarayıcı sekmesi kapatıldığında silinir.
- Erişim Kapsamı: SessionStorage, verilere yalnızca aynı tarayıcı sekmesi içinden erişilmesine izin verirken, LocalStorage verileri aynı origin ( kökenden ) gelen tüm sekmeler ve pencereler arasında paylaşılabilir.
Her iki depolama yöntemi de, kullanıcı deneyimini geliştirmek ve web uygulamalarında durum yönetimi için güçlü araçlardır.
Buraya kadar okuduysanız teşekkür ederim. Elimden geldiğince sade ve anlaşılır bir şekilde anlatmaya çalıştım.Bu makaleyi yararlı bulduysanız beni sosyal medya üzerinden takip edebilirsiniz. Eğer bana bir kahve ısmarlamak isterseniz aşağıdaki linki kullanabilirsiniz.
