JavaScript·100 питань

[ITEM 5] QUESTION: Чим відрізняються localStorage і sessionStorage?

Відповідь

Різниця між localStorage і sessionStorage полягає в тривалості життя і області видимості даних, що зберігаються, хоча обидва ці механізми надають ідентичний API для роботи з вебсховищем браузера. localStorage призначений для довгострокового зберігання даних. Інформація, записана в localStorage, зберігається безстроково — вона не видаляється при закритті вкладки чи браузера і буде доступна під час наступних візитів користувача на сайт доти, доки дані не будуть стерті програмно через код або вручну через налаштування браузера.

sessionStorage працює інакше і орієнтований на тимчасове зберігання даних у межах однієї конкретної вкладки або вікна браузера. Дані в sessionStorage живуть тільки доти, доки відкрита вкладка, в якій вони були створені. Щойно користувач закриває цю вкладку або вікно браузера, вся інформація в sessionStorage безповоротно видаляється. Якщо користувач відкриє ту саму сторінку в новій вкладці, у неї буде зовсім нове і порожнє сховище sessionStorage, навіть якщо домен залишився колишнім.

Обидва сховища мають схожі обмеження щодо обсягу пам'яті, який зазвичай становить від 5 до 10 мегабайт залежно від конкретного браузера. І перше, і друге сховище підтримують однаковий набір методів: setItem, getItem, removeItem, clear, а також працюють виключно з рядками, вимагаючи застосування JSON.stringify і JSON.parse для збереження об'єктів і масивів.

Синхронність операцій характерна для обох типів сховищ: усі запити на читання та запис виконуються в основному потоці JavaScript блокуючим чином. Вибір між ними залежить від бізнес-логіки: localStorage ідеально підходить для збереження користувацьких налаштувань теми, токенів авторизації чи кошика інтернет-магазину, тоді як sessionStorage незамінний для тимчасових даних, таких як стан багатокрокової форми, дані фільтрів поточної сесії або захист від повторного надсилання запитів, які не повинні переноситися між різними вкладками одного сайту.

Чи корисна ця відповідь?

Інші питання цієї теми

Пов’язані питання з інших тем