ยอมรับกันตามตรงว่า AppCache นั้นน่ารำคาญและมีปัญหา [1, 2, 3] ข้อจํากัดที่สําคัญอย่างหนึ่งคือ ไม่สามารถแคชชิ้นงานแบบไดนามิกตามคําขอ โดยพื้นฐานแล้ว การดำเนินการนี้จะเป็นแบบทั้งทำหรือทั้งไม่ทำเมื่อต้องการนำแอปออฟไลน์ ระบบจะแคชทุกอย่างในไฟล์ Manifest ไว้ล่วงหน้า หรือจะแคชข้อมูลใดๆ ไว้เลยก็ได้
FileSystem API ของ HTML5 จึงกลายเป็นโซลูชันที่น่าสนใจสำหรับข้อบกพร่องของ AppCache ผู้ใช้สามารถจัดเก็บไฟล์และลําดับชั้นโฟลเดอร์ในระบบไฟล์ในเครื่อง (แซนด์บ็อกซ์) โดยใช้โปรแกรม จากนั้นจึงเพิ่ม/อัปเดต/นําทรัพยากรแต่ละรายการออกตามต้องการ เพื่อนร่วมงานของฉัน Boris Smus ยังได้เขียนไลบรารีที่ยอดเยี่ยมเพื่อจัดการการแคชแบบออฟไลน์ประเภทนี้ในบริบทของเกม แนวคิดเดียวกันนี้สามารถขยายผลให้ทำงานร่วมกับเว็บแอปประเภทใดก็ได้
crbug.com/89271 เป็นการแก้ไขที่สำคัญสำหรับ FileSystem API ซึ่งทำให้เส้นทาง filesystem: URL แบบสัมพัทธ์ทำงานได้อย่างราบรื่น
สมมติว่าฉันบันทึก index.html ในโฟลเดอร์รูทของระบบไฟล์ (fs.root) สร้างโฟลเดอร์ img และบันทึก "test.png" ไว้ในโฟลเดอร์นั้น URL filesystem: ของไฟล์ 2 ไฟล์ดังกล่าวจะเป็น filesystem:http://example.com/temporary/index.html และ filesystem:http://example.com/temporary/img/test.png ตามลำดับ จากนั้น หากต้องการใช้ "test.png" สำหรับ img.src ฉันต้องใช้เส้นทางแบบสัมบูรณ์แบบเต็ม: <img src="filesystem:http://example.com/temporary/img/test.png"> ซึ่งหมายความว่าต้องเขียน URL แบบสัมพัทธ์ทั้งหมดใน index.html ใหม่ให้ชี้ไปยัง filesystem: URL ของไฟล์ที่เกี่ยวข้อง ไม่เจ๋งเลย ตอนนี้เมื่อแก้ไขข้อบกพร่องนี้แล้ว ฉันจะเก็บเส้นทางแบบสัมพัทธ์ไปยังไฟล์ (<img src="img/test.png">) ไว้ได้ เนื่องจากระบบจะแก้ไขเส้นทางไปยังต้นทางของระบบไฟล์ได้อย่างถูกต้อง
ฟีเจอร์นี้ช่วยให้คุณดึงหน้าเว็บและบันทึกทรัพยากรทั้งหมดของหน้าเว็บแบบออฟไลน์ได้ง่ายๆ ในขณะเดียวกันก็ยังคงโครงสร้างโฟลเดอร์แบบเดียวกับเวอร์ชันออนไลน์