This gist lists challenges you run into when building offline-first applications based on IndexedDB, including open-source libraries like Firebase, pouchdb and AWS amplify (more).
Note that some of the following issues affect only Safari. Out of the major browsers, Chrome's IndexedDB implementation is the best.
When this bug occurs, every time you use the indexeddb, the WAL file grows. Garbage collection doesn't seem to be working, so after a while, you end up with gigabytes of data.
For offline-first operation, browser apps cache data in an IndexedDb database. When the user makes a change while offline, they persist the change optimistically. When connectivity is restored, changes are synced to the server.
This pattern is well established today. However, given the possibility of opening the app in multiple tabs at the same time, we seem to be faced with a dilemma:
We allow users to use the app and to make changes in multiple tabs at the same time. But then two "threads" are writing to the same shared resource at the same time. Co-ordinating writes seems to be difficult.
To make things worse, while the localStorage API allows you to register a callback that fires whenever an item is changed outside the current tab, the IndexedDb API doesn't, at least not in a widely-available way.
Alice is writing a new library, and she is excited to use the new ES6 syntax. However, she would like to use an older but still good package she found on npm, that exports its interface using CommonJS. She does so easily after reading the NodeJS documentation on how to do this.
Bob is updating a module for his work, and he needs to support existing CommonJS-using codebases as well as a new project that prefers to stick with ES6 for static analysis reasons. He publishes a package that exports both kinds of interfaces.
Carol is updating her popular code coverage reporting tool for the new world. She uses the ESM loader hooks to instrument test code as it is imported so she can get code coverage reporting on par with what she has for CommonJS.
David is writing a transpiler. He writes a custom hook that transpiles source as it's loaded from his language to JavaScript.
Since Twitter doesn't have an edit button, it's a suitable host for JavaScript modules.
Source tweet: https://twitter.com/rauchg/status/712799807073419264
const leftPad = await requireFromTwitter('712799807073419264');