Mettere un'intera pagina offline utilizzando l'API FileSystem HTML5

Eric Bidelman

Ammettiamolo, AppCache è fastidiosa e presenta problemi [1, 2, 3]. Un grande limite è dato dall'impossibilità di memorizzare dinamicamente gli asset nella cache on demand. In pratica, è tutto o niente quando si tratta di mettere offline un'app. Tutti i contenuti del file manifest vengono memorizzati nella cache in anticipo oppure nessun elemento viene memorizzato nella cache.

L'API FileSystem HTML5 diventa una soluzione attraente per le carenze di AppCache. È possibile archiviare in modo programmatico file e gerarchie di cartelle nel file system locale (con sandbox) e successivamente aggiungere/aggiornare/rimuovere singole risorse in base alle necessità. Il mio collega, Boris Smus, ha persino scritto una bella raccolta per gestire questo tipo di memorizzazione nella cache offline nel contesto dei giochi. La stessa idea può essere estrapolata per funzionare con qualsiasi tipo di applicazione web.

crbug.com/89271 è una correzione importante per l'API FileSystem che rende i percorsi relativi del filesystem: URL funzionano come un charm.

Supponiamo, ad esempio, di aver salvato index.html nella cartella principale del file system (fs.root), creato una cartella img e salvato "test.png" al suo interno. L'URL filesystem: per questi due file sarà rispettivamente filesystem:http://example.com/temporary/index.html e filesystem:http://example.com/temporary/img/test.png. Poi, per utilizzare "test.png" per un img.src, dovevo utilizzare il suo percorso assoluto completo: <img src="filesystem:http://example.com/temporary/img/test.png">. Ciò significava riscrivere tutti gli URL relativi in index.html in modo che puntassero all'URL filesystem: del file corrispondente. Non va bene! Ora, con questa correzione di bug, posso mantenere il percorso relativo del file (<img src="img/test.png">) perché verrà risolto correttamente in un'origine del file system.

Questa funzionalità rende banale aprire una pagina e salvare tutte le risorse offline, pur mantenendo la stessa struttura delle cartelle della versione online.