Local storage nedir? Local storage, web sayfalarında kullandığımız verileri tarayıcıda depolamamızı sağlayan bir web teknolojisidir Bu sayede, web sayfalarımız daha hızlı ve daha güvenli hale gelir Detaylar için yazımıza göz atabilirsiniz

Local Storage, günümüzde sıklıkla kullanılan web tekniklerinden biri olan web storage'ın bir parçasıdır. Web storage, web uygulamalarında, kullanıcının tarayıcısına verilerin yerel olarak depolanması için kullanılır. Local Storage'a kaydedilen veriler, farklı dokümanlarda kullanılabilen key-value çiftleri ile depolanır. Bu sayede, kullanıcılar offline olarak da verilere erişebilirler.
Local Storage, birçok avantajı ile de dikkat çeker. Verilerin yerel olarak saklanması, sunucu maliyetlerini düşürebilirken, offline kullanıma olanak tanıması sayesinde kullanıcıların verileri kaybetme riski minimuma indirilebilir. Ayrıca, verimlilik açısından da önemlidir. Kullanıcı verileri, web uygulamalarındaki farklı işlemlerde sıkça kullanıldığı için, tarayıcının her seferinde sunucu tarafına sorgu göndermesi gerekmeyerek, uygulamanın hızı artırılabilir.
Session Storage nedir?
Session Storage, web storage tekniklerinden biridir ve tarayıcı seansı boyunca verilerin saklanmasını sağlar. Bu veriler, tarayıcıyı açık tuttuğunuz süre boyunca geçerlidir ve tarayıcı kapandığında otomatik olarak silinir. Session Storage, her kullanıcı için ayrı bir depolama alanına sahiptir ve bu nedenle diğer kullanıcılardan erişilemez.
Session Storage, form bilgileri, sayfa önbelleği ve kullanıcı tercihleri gibi geçici verilerin saklanmasında yaygın olarak kullanılır. Bu özellik, gezinme araçlarının her seferinde yeni veri yüklemesi veya sayfaları yeniden yüklemesi gerektiğinde verimliliği artırır.
Session Storage, Local Storage'a benzer şekilde key-value çiftleri ile çalışır. Ancak Local Storage'dan farklı olarak veriler tarayıcı seansı süresince aktif kalmaktadır. Kullanıcının sayfalar arasında gezinirken veya sayfayı yenilerken verilerin kaybolmayacağından emin olunur.
Local Storage ve Session Storage arasındaki fark nedir?
Web uygulamalarında kullanılan Local Storage ve Session Storage arasındaki en önemli fark, depolama ömürleridir. Local Storage, tarayıcı kapatılıp açılsa bile depolanan veriler kalırken; Session Storage, sadece tarayıcı sürümü süresince geçerlidir.
Bunun nedeni, Local Storage’un verileri kalıcı olarak tarayıcının belleğinde tutmasıdır. Yani bir kullanıcı, bir web uygulamasını kullanırken belirli verileri tarayıcısına kaydeder ve farklı seanslar arasında bu verilere erişebilir. Örneğin, bir kullanıcının siteyi terk etmeden önce doldurduğu bir form, sonraki kullanımlarda kaydedilir ve kullanıcının daha sonra formu yeniden doldurmadan önce verileri düzenlemesine olanak tanır.
Session Storage ise, tarayıcı sürümü süresince geçerlidir. Session Storage’un verileri, kullanıcının tarayıcısında bir seans açtığında bellekte tutulur ve kullanıcı oturumunu sonlandırdığında veya tarayıcısını kapattığında silinir. Bu nedenle, Session Storage yaygın olarak geçici verilerin depolanması için kullanılır ve gizlilik açısından daha güvenlidir.
Local Storage ve Session Storage nerede kullanılır?
Local Storage ve Session Storage, web uygulamalarında kullanıcının verilerinin yerel depolama için tercih edilen teknolojilerdir. Bu depolama teknikleri, kullanıcının verilerini tarayıcı içerisinde saklayarak, server'a herhangi bir istekte bulunmadan bu verilere ulaşmayı sağlar.
Web uygulamalarında, Local Storage genellikle tercih edilen teknik olup, verilerin tutulduğu dosyaların boyutu tarayıcı sınırlarına göre değişebilir. Session Storage ise daha geçici verilerin saklanması için kullanılır ve seans süresi bittiğinde veriler otomatik olarak silinir. Böylece sunucunun üzerindeki yük azaltılırken, verimlilik de artırılmış olur.
Örneğin, bir e-ticaret uygulamasında, kullanıcının sepetindeki ürünleri Local Storage veya Session Storage kullanarak depolayabilirsiniz. Böylece kullanıcı farklı sayfalar arasında gezinsin veya tarayıcıyı kapatıp tekrar açsın, ürünler sepette kalır ve kullanıcı her seferinde ürünleri tekrar eklemek zorunda kalmaz.
Local Storage ve Session Storage, kullanıcı deneyimini iyileştirmekte önemli bir rol oynar. Bu teknolojiler sayesinde kullanıcılara offline erişim imkanı sağlandığı gibi, sunucu maliyetlerinde de ciddi tasarruf etmek mümkün olur.
Local Storage kullanımı ile ilgili örnek kod
Web uygulamaları, kullanıcıların verilerini tutmak zorundadırlar. Bu verileri saklamak için ise Local Storage ve Session Storage kullanılabilir. Bu depolama yöntemleri, HTML5'de tanıtılmıştır. Eğer tarayıcınız HTML5'i destekliyorsa, bu yöntemleri kullanabilirsiniz.
Local Storage, web sayfası tarafından oluşturulan bir web storage tekniğidir. Key-value çiftleri sayesinde, güncelleme veya silme işlemi yapmadan kolay bir şekilde veriler depolanabilir. Bu yöntem, tarayıcı kapandığında bile depolama alanını korur. İşte Local Storage kullanımına dair örnek kod:
localStorage.setItem('key', 'value');
Session Storage ise, tarayıcı seans süresince verilerin saklanabileceği bir web storage tekniğidir. Local Storage'dan farklı olarak, Session Storage yalnızca tarayıcı sürümü süresince geçerlidir. İşte Session Storage kullanımına dair örnek kod:
sessionStorage.setItem('key', 'value');
Local Storage ve Session Storage, web uygulamalarında kullanımı oldukça basit olan veri depolama yöntemleridir. Bu yöntemler, bazı avantajlara da sahiptir. Örneğin, sunucu maliyetlerini düşürür, verimliliği artırır ve offline kullanıma imkan tanır. Bu nedenle, modern web uygulamalarının neredeyse tamamında bu yapılara rastlanır.
Form verilerini Local Storage veya Session Storage ile nasıl saklayabiliriz?
Web uygulamalarında, kullanıcının verilerinin yerel depolama için kullanılabilen Local Storage ve Session Storage tekniklerini kullanarak form verileri kolayca saklanabilir. Form submit edilmeden önce, form verileri JavaScript fonksiyonu yardımıyla Local veya Session Storage'a kaydedilebilir. Bu sayede, kullanıcının daha önceki form doldurduğu veriler hatırlanarak daha hızlı ve pratik bir kullanıcı deneyimi sunulabilir.
LocalStorage.setItem('username', document.getElementById('username').value);LocalStorage.setItem('email', document.getElementById('email').value);
Yukarıdaki JavaScript kodlarında, kullanıcının formda girdiği kullanıcı adı ve e-posta verileri Local Storage'a kaydedilmiştir. Kaydedilen verilere, formun yeniden yüklendiği veya kullanıcının sayfayı yenilediği sürece erişilebilir.
Session Storage kullanarak form verilerini saklamak isterseniz de aynı şekilde kaydetme işlemi yapılabilir:
SessionStorage.setItem('username', document.getElementById('username').value);SessionStorage.setItem('email', document.getElementById('email').value);
Burada da kullanıcının formda girdiği kullanıcı adı ve e-posta verileri Session Storage'a kaydedilmiştir. Ancak, Session Storage yalnızca tarayıcının açık olduğu süre boyunca verileri saklar ve tarayıcı kapandığında veriler silinir.
Yukarıda anlatılan yöntemleri kullanarak, web sayfanızda kaydedilen form verilerinin güvenli ve hızlı bir şekilde saklanmasını sağlayabilirsiniz.