Как использовать localstorage и cookie?

Question

[0348raven]

Что лучше и как использовать?
Есть например скрипт, который срабатывает для специальной версии, сейчас он добавляет к каждому тегу в DOM стили. Чтобы они сохранялись при переходе по страницам необходимо их запоминать в cookie или localstorage насколько я понимаю. Выбрал последнее.

function supports_html5_storage() {
    try {
        return 'localStorage' in window && window['localStorage'] !== null;
    } catch (e) {
        return false;
    }
}

var foo = localStorage.getItem("special-version-js");
// ...
localStorage.setItem("special-version-js", foo);

Кто-то может мне доступно объяснить, что лучше выбрать и как использовать?

Comments

[Алексей Уколов]

Что именно вам нужно объяснить? Вы уже используете localStorage в вашем коде, что вам непонятно?

[0348raven]

Проблема только одна, спеуиальная версия у меня, то есть можно переключаться (ЧБ, БЧ, шрифт больше, шрифт), но естесственно при переходе по страницам необходимые стили сбрасываются.
Есть ли какая-то возможность получать их из localStorage?

Answer 1

[Ivanq]

Лучше localStorage для таких целей.
1. Cookie сохраняются либо на время, либо до окончания сессии. localStorage сохраняется навсегда.
2. Если куки отключают все, кому не лень, localStorage обычно не трогают вообще.
3. Куки скриптом сложно вытаскивать, разбирать там что-то. Для localStorage есть getItem.
4. Удалить куку (не присвоить "", а именно удалить) вообще невозможно. Для localStorage это будет localStorage.removeItem.
5. Присвоение кук выглядит ужасно:

document.cookie = 'mynewcookie=1'; // Нет, это не удаление всех кук и создание одной единственной

Итог: Юзаем localStorage!

Вот подобрал несколько картинок:


А ведь есть еще localForage, indexedDB, sessionStorage...

Comments

[Алексей Уколов]

jsperf какой-то упоротый. Вместо того, чтобы попарно сравнить чтение в lS/cookie и запись, сравнили всё со всем. Ура, теперь мы видим, что запись в куку аж на 75% быстрее чтения из lS.

[Ivanq]

Алексей Уколов: Вы хотели сказать, на 75% медленнее?

[Yaroslav Lyzlov]

А какая разница? Разные инструменты, для разных вещей.

[Алексей Уколов]

Ivanq: Нет, быстрее. Это даже на скрине видно - запись в куку выдеелна зеленым цветом, значит, это самая быстрая операция.