Hãy đối mặt với thực tế rằng AppCache gây phiền toái và có vấn đề [1, 2, 3]. Một hạn chế lớn là không thể lưu các thành phần vào bộ nhớ đệm một cách linh động theo yêu cầu. Về cơ bản, điều này khiến việc đưa ứng dụng vào chế độ ngoại tuyến trở thành một việc toàn bộ hoặc không có gì. Mọi nội dung trong tệp kê khai đều được lưu vào bộ nhớ đệm trước hoặc không có nội dung nào được lưu vào bộ nhớ đệm.
FileSystem API của HTML5 trở thành một giải pháp hấp dẫn cho những điểm yếu của AppCache. Bạn có thể lưu trữ các tệp và hệ thống phân cấp thư mục theo phương thức lập trình trong hệ thống tệp cục bộ (hộp cát) và sau đó thêm/cập nhật/xoá từng tài nguyên nếu cần. Đồng nghiệp của tôi, Boris Smus, thậm chí còn viết một thư viện hay để quản lý loại bộ nhớ đệm ngoại tuyến này trong bối cảnh trò chơi. Bạn có thể áp dụng ý tưởng tương tự cho mọi loại ứng dụng web.
crbug.com/89271 là một bản sửa lỗi quan trọng cho API FileSystem, giúp các đường dẫn filesystem: URL tương đối hoạt động hiệu quả.
Ví dụ: tôi đã lưu index.html trong thư mục gốc của hệ thống tệp (fs.root), tạo thư mục img và lưu "test.png" trong đó. URL filesystem: cho hai tệp đó sẽ lần lượt là filesystem:http://example.com/temporary/index.html và filesystem:http://example.com/temporary/img/test.png. Sau đó, nếu muốn sử dụng "test.png" cho img.src, tôi cần sử dụng đường dẫn tuyệt đối đầy đủ của tệp đó: <img src="filesystem:http://example.com/temporary/img/test.png">. Điều đó có nghĩa là bạn phải viết lại tất cả URL tương đối trong index.html để trỏ đến URL filesystem: của tệp tương ứng. Không hay chút nào! Giờ đây, với bản sửa lỗi này, tôi có thể giữ nguyên đường dẫn tương đối đến tệp (<img src="img/test.png">) vì các đường dẫn này sẽ phân giải chính xác đến nguồn hệ thống tệp.
Tính năng này giúp bạn dễ dàng tải một trang xuống và lưu tất cả tài nguyên của trang đó khi không có kết nối mạng, đồng thời vẫn giữ nguyên cấu trúc thư mục giống như phiên bản trực tuyến.