HTML5 localStorage per le attività (fogli di stile, JavaScript, immagini, ecc)
-
22-09-2019 - |
Domanda
Per risparmiare tempo client per il download e l'utilizzo della rete, è possibile utilizzare la funzione di localStorage di HTML5 per memorizzare i contenuti dei fogli di stile collegati, file JavaScript e dati binari (ad esempio immagini), piuttosto che colpire il server ogni volta?
Vorrei che solo complicare le cose - in quanto presumo si dovrà aggiungere l'attività collegata tramite JavaScript piuttosto che solo un elemento script
o link
, di suddividere la pagina per chi non ha JavaScript abilitato)? A meno che non si può analizzare il contenuto (utilizzando HEAD
il check data dell'ultima modifica e altre intestazioni) prima che il browser lo scarica.
O meglio solo per attaccare con le intestazioni 304 Not Modified
e eTag
?
Soluzione
Credo che in questo caso si dovrebbe considerare offline caching:
Puoi anche dati di input archivio utenti in localStorage o sessionStorage:
- https://developer.mozilla.org/en/DOM/Storage#sessionStorage
- https://developer.mozilla.org/en/DOM/Storage#localStorage
Non utilizzare globalStorage (non standard).
Ho scritto un articolo su non in linea, vedi: http: // hacks.mozilla.org/2010/01/offline-web-applications/
Si tratta di linea, ma tale meccanismo può essere utilizzato per aumentare il vostro web app.
Altri suggerimenti
Si potrebbe base64 codificare i dati immagine / binari e conservarla come una stringa in localStorage, utilizzando base64 gli URL non funziona in alcuni browser, quindi non è una soluzione perfetta.
CSS e JS andrebbe bene, li si potrebbe scrivere nella pagina, o utilizzare un URL base64 anche.
Non mi preoccupo di fare questo rompendo il sito per gli utenti non JS, come è JS è disabilitato localStorage accesso non posso in ogni caso.