PWA persistent storage best practice

Question

What is best practice for a PWA to store user generated data in a persistent way?

My app lets the user generate up to 5 MB of data that needs to be stored and accessed locally, but also backed up regularly in case the device gets damaged/lost, or the user accidentally wipes the data.

If I use FileSystemAPI or IndexedDB, is there some automatic backup system I can take advantage of? For example "Auto Backup for Apps" makes automatic backups on Google Drive for regular Android apps. Would be great if there is something similar available to PWAs.

In terms of user experience, does FileSystemAPI work well? I've read that even if the PWA is installed to the home screen, the user has to grant permission every session, which would be inconvenient.

Breastfeed

Answer 1

If you want to store data persistently on the user's machine, consider using the Persistent Storage APIs. These APIs allow you to request permission to store data persistently. Any data stored there will be exempt from clearing browser data, for instance.

Another possibility for you is the upcoming Native File System APIs. With those APIs, you can write to the file system, which again will be exempt from clearing browser data.

Discourteous

This proposal has been abandoned by now? – Bund

It's implemented in many browsers now: caniuse.com/mdn-api_permissions_permission_persistent-storage – Discourteous

Sorry, I was referring only to the (formerly known as) Native File System APIs. – Bund

It's now called the File System API, and it's implemented in Chromium and, to some extend, Firefox and Safari developer.mozilla.org/en-US/docs/Web/API/File_System_API – Discourteous

"to some extent"? It is a completely different standard to the native file access. And is fairly well supported in Firefox, apart from the permissions. The Native File Access is no longer an official proposal. Effectively, it has been abandoned. – Bund

It does what the OP is asking: letting web apps save files to the file system, outside of any storage quotas. The answer remains a valid option: use Persistent Storage APIs, but if you can't, you can use the File System APIs with user permission to store data outside of your web app's storage quota. – Discourteous