AppCache ist ärgerlich und hat Probleme [1, 2, 3]. Eine große Einschränkung besteht darin, dass es nicht möglich ist, Assets dynamisch auf Abruf im Cache zu speichern. Das bedeutet, dass Sie eine App entweder vollständig offline stellen oder sie online lassen können. Entweder wird alles im Manifest vorab im Cache gespeichert oder nichts.
Die HTML5-FileSystem API ist eine attraktive Lösung für die Mängel von AppCache. Dateien und Ordnerhierarchien können programmatisch im lokalen (Sandbox-)Dateisystem gespeichert und anschließend nach Bedarf einzelne Ressourcen hinzugefügt, aktualisiert oder entfernt werden. Mein Kollege Boris Smus hat sogar eine nette Bibliothek geschrieben, um diese Art von Offline-Caching im Kontext von Spielen zu verwalten. Derselbe Ansatz kann auf jede Art von Webanwendung angewendet werden.
crbug.com/89271 ist eine wichtige Fehlerkorrektur für die FileSystem API, durch die relative filesystem: URL-Pfade einwandfrei funktionieren.
Angenommen, ich habe index.html im Stammverzeichnis des Dateisystems (fs.root) gespeichert, einen Ordner „img“ erstellt und „test.png“ darin gespeichert. Die filesystem:-URL für diese beiden Dateien lautet filesystem:http://example.com/temporary/index.html bzw. filesystem:http://example.com/temporary/img/test.png. Wenn ich „test.png“ für ein img.src verwenden möchte, muss ich den vollständigen absoluten Pfad verwenden: <img src="filesystem:http://example.com/temporary/img/test.png">. Das bedeutete, dass alle relativen URLs in index.html so umgeschrieben werden mussten, dass sie auf die filesystem:-URL der entsprechenden Datei verweisen. Das ist nicht cool! Dank dieser Fehlerkorrektur kann ich den relativen Pfad zur Datei (<img src="img/test.png">) beibehalten, da er korrekt auf einen Dateisystemursprung verweist.
Mit dieser Funktion können Sie eine Seite herunterladen und alle zugehörigen Ressourcen offline speichern. Dabei bleibt die Ordnerstruktur der Onlineversion erhalten.