Local Storage vs Cookies

Question

Ich möchte die Ladezeiten meiner Websites reduzieren, indem ich alle Cookies in den lokalen Speicher verschiebe, da sie anscheinend die gleiche Funktionalität haben. Gibt es Vor- / Nachteile (insbesondere in Bezug auf die Leistung), wenn man den lokalen Speicher verwendet, um die Cookie-Funktionalität zu ersetzen, abgesehen von den offensichtlichen Kompatibilitätsproblemen?

Answer 1

Es ist auch erwähnenswert, dass localStorage in einigen Versionen von Mobile Safari nicht verwendet werden kann, wenn Benutzer im "privaten" Modus surfen.

Zitiert aus dem WayBack Archive von MDN-Thema zu Window.localStorage zurück im Jahr 2018:

Hinweis: Ab iOS 5.1 speichert Safari Mobile localStorage-Daten im Cache-Ordner, der gelegentlich aufgeräumt wird, auf Anweisung des Betriebssystems, normalerweise wenn der Speicherplatz knapp ist. Der private Browsing-Modus von Safari Mobile verhindert auch das Schreiben von Daten in localStorage vollständig.

Answer 2

Cookie:

• ist von JavaScript zugänglich, sodass Cookie-Daten von einem XSS-Angriff (Cross-Site-Scripting-Angriff) gestohlen werden können, aber das Setzen des HttpOnly-Flags am Cookie verhindert den Zugriff von JavaScript, sodass die Cookie-Daten vor einem XSS-Angriff geschützt sind.

• ist anfällig für CSRF (Cross-Site-Request-Forgery), aber durch das Setzen des SameSite-Flags mit Lax am Cookie wird CSRF gemindert, und das Setzen des SameSite-Flags mit Strict am Cookie verhindert CSRF.

• muss ein Ablaufdatum haben, damit, wenn das Ablaufdatum überschritten wird, das Cookie automatisch gelöscht wird, sodass selbst wenn Sie vergessen, das Cookie zu löschen, wird das Cookie aufgrund des Ablaufdatums automatisch gelöscht.

• hat in der Regel eine Größe von etwa 4 KB (je nach Browser).

LocalStorage:

• ist von JavaScript zugänglich, sodass LocalStorage-Daten von einem XSS-Angriff (Cross-Site-Scripting-Angriff) gestohlen werden können. Soweit ich recherchiert habe, gibt es keine einfachen Vorkehrungen für LocalStorage gegen XSS-Angriffe.

• ist nicht anfällig für CSRF (Cross-Site-Request-Forgery).

• hat kein Ablaufdatum, sodass wenn Sie vergessen, LocalStorage-Daten zu löschen, können die LocalStorage-Daten für immer bestehen bleiben.

• hat in der Regel eine Größe von etwa 5 MB (je nach Browser).

Ich empfehle die Verwendung von Cookies für sensible Daten und LocalStorage für nicht sensible Daten.

Answer 3

Der lokale Speicher kann bis zu 5 MB Offline-Daten speichern, während die Sitzung auch bis zu 5 MB Daten speichern kann. Cookies können jedoch nur 4 KB Daten im Textformat speichern.

Der lokale und der Session-Speicher speichern Daten im JSON-Format, was das Parsen erleichtert. Die Daten von Cookies sind jedoch im Stringformat.

Answer 4

Nun, die Geschwindigkeit des lokalen Speichers hängt weitgehend vom Browser des Clients ab, den er verwendet, sowie vom Betriebssystem. Chrome oder Safari auf einem Mac könnten viel schneller sein als Firefox auf einem PC, insbesondere mit neueren APIs. Wie immer ist jedoch das Testen Ihr Freund (ich konnte keine Benchmarks finden).

Ich sehe wirklich keinen großen Unterschied zwischen Cookie und lokalem Speicher. Außerdem sollten Sie sich mehr um Kompatibilitätsprobleme kümmern: Nicht alle Browser haben begonnen, die neuen HTML5-APIs zu unterstützen, sodass Cookies Ihre beste Wahl für Geschwindigkeit und Kompatibilität wären.