Cookies i Local Storage, czyli przechowywanie danych w przeglądarce

Prędzej czy później będziesz chciał przechować jakieś dane w przeglądarce użytkownika, i niekoniecznie muszą to być cookies.

Ciasteczka mają ograniczony rozmiar – jedynie 4 kB, a do tego sprawiają problemy już przy samym odczytywaniu czy zapisywaniu. Jeśli myślisz o płynnej pracy, bez dodatkowej biblioteki się nie obejdzie.

Local Storage i Session Storage to bardziej nowoczesne sposoby.

W HTML5 mamy natywne API, które pozwala szybko stworzyć lub odczytać dany element.

Mamy też znacznie więcej miejsca niż na ciasteczka, co najmniej kilka MB – zależnie od przeglądarki.

Warto wiedzieć, że w Storage wszystko zapisywane jest jako ciąg tekstowy, więc gdy zapisujesz obiekt lub tablicę, warto wykorzystać JSON.stringify(), by przekonwertować je najpierw na wartość tekstową. Potem, za pomocą JSON.parse() możesz te wartości z powrotem odczytać.

Więcej w wideo:

Przeczytaj też...

Kurs JavaScript 3/10 – drzewo DOM i wybieranie elementów

Krótkie podsumowanie akcji na Wykopie – 12 mitów i błędów programisty

Jak wyglądał świat Front Endu w 2017 roku?

Jakub Jurkian

Pracuję jako Front End Developer w Londynie. Od ponad 11 lat jestem programistą-pasjonatem, a strony (i wszystko co z nimi związane) tworzę od 6 lat. Jestem też autorem kursów wideo - od 2013 roku prowadzę kanał na YouTube i tego bloga. Zaczynałem od pisania artykułów dla jednego z czołowych polskich portali IT - benchmark.pl. Prywatnie od 10 lat jestem związany z kulturą hip-hop (głównie taniec breakdance).