Ποια είναι τα βασικά πλεονεκτήματα και διαφορές μεταξύ LocalStorage, SessionStorage και Cookies στην αποθήκευση δεδομένων στον browser;

Το LocalStorage, SessionStorage και Cookies είναι τρεις τρόποι αποθήκευσης δεδομένων στον browser, αλλά διαφέρουν σε όγκο, διάρκεια ζωής και πεδίο ορατότητας:

• LocalStorage:

  • Αποθηκεύει δεδομένα χωρίς ημερομηνία λήξης, μέχρι ο χρήστης να τα διαγράψει χειροκίνητα.
  • Τα δεδομένα είναι διαθέσιμα σε όλες τις καρτέλες και παράθυρα του ίδιου domain.
  • Ο όγκος είναι συνήθως περίπου 5-10 MB.
  • Δεν αποστέλλονται στον διακομιστή σε κάθε αίτημα.

• SessionStorage:

  • Τα δεδομένα ζουν μόνο μέσα σε μια συνεδρία (όσο είναι ανοιχτή η καρτέλα του browser).
  • Τα δεδομένα δεν είναι διαθέσιμα σε άλλες καρτέλες ή παράθυρα.
  • Ο όγκος είναι παρόμοιος με αυτόν του LocalStorage.
  • Δεν αποστέλλονται στον διακομιστή.

• Cookies:

  • Έχουν περιορισμένο όγκο (περίπου 4 KB).
  • Μπορούν να έχουν διάρκεια ζωής, μετά την οποία διαγράφονται.
  • Αποστέλλονται στον διακομιστή σε κάθε HTTP αίτημα προς το αντίστοιχο domain.
  • Χρησιμοποιούνται για αυθεντικοποίηση, παρακολούθηση συνεδριών κ.λπ.

Παράδειγμα χρήσης του LocalStorage:

// Αποθήκευση δεδομένων
localStorage.setItem('username', 'user123');

// Ανάκτηση δεδομένων
const user = localStorage.getItem('username');