Ciasteczkowy potwór
kontra magazynier
albo cookies vs localStorage

Maciej Brencz, Wikia Inc.
macbre@wikia-inc.com
23 lutego 2012

Rys historyczny

• 1994 - Mosaic Netscape v0.9beta (pierwsza przeglądarka z obsługą ciastek)
• 1995 - Internet Explorer 2.0 wspiera ciasteczka
• 1996 - Financial Times porusza kwestie prywatności i ciasteczek
• 1997 - ukazuje się specyfikacja ciasteczek (RFC 2109)
• 1998 - ciasteczka zostają opatentowane
• 2002 - opcja HttpOnly (dodana do specyfikacji w 2011 r.).

Ciasteczka - z czym to się je?

• fragment zapytania i odpowiedzi HTTP
• dostęp po stronie serwera
• jak i przeglądarki klienta
• możliwość określenia domen, które mogą odczytać ciastko
• określony czas "życia" (TTL)
• opcja HttpOnly
• rozmiar ograniczony do ok. 4 kB.

1997? Przecież to prehistoria!

localStorage

• 1999 - Internet Explorer 5 wspierający userData - 640 kB (skąd ja to znam? ;)
• 2006 - Firefox 2.0 wspiera localStorage (jeszcze nieoficjalnie)
• 2011 - w specyfikacji W3C Web Storage (część HTML5)
• wspierany przez Chrome 4+, Firefoxa 2+, IE8+, Opera 10.50+, Safari 4+
• dostępny tylko w przeglądarce
• do 5 MB na dane klucz - wartość (typu string)
• permanentna pamięć (brak definicji TTL).

Przykłady użycia localStorage

• pamiętanie stanu aplikacji internetowej na wypadek zawieszenia się przeglądarki
• cache dla danych aplikacji
• pamięć dla ustawień użytkownika
• wydajniejsze śledzenie aktywności użytkownika
• zamiennik cache'a przeglądarki (aplikacje / strony mobilne).

Ciasteczkowy potwór kontra magazynier

localStorage i jQuery

• $.storage = new $.store() - inicjalizacja wtyczki
• $.storage.set('foo', {bar: true}) - zapisanie klucza
• $.storage.get('foo') - odczyt klucza
• $.storage.del('foo') - usuwa klucz
• $.storage.flush() - usuwa wszystkie klucze domeny
• wtyczka zapewnia serializację danych do JSON'a / XML'a
• korzysta z userData w Internet Explorer 7.

Czyli mam zamienić ciasteczka na localStorage, tak?

Nie do końca

Pytania?