Kinto.js is an offline-first JavaScript client leveraging the Kinto API for data synchronization. In a world where connectivity isn't always guaranteed, local persistence in the browser has become an identified priority for Web applications, especially on mobile.
The basic principle is simple; save your data locally, assuming there's no network connectivity. Then as soon as it's available, retrieve remote changes and push your local data to a remote server.
const kinto = new Kinto({remote: "https://demo.kinto-storage.org/v1/"});
const tasks = kinto.collection("tasks");
tasks.create({label: "Test kinto.js", done: false})
.then(_ => tasks.sync())
.then(res => {
if (res.ok) {
alert("Data have been synchronized!");
}
});
Local persistence in the browser is achieved using IndexedDB, and we've tried hard to hide its inherent low-level usage complexity — mainly due to its fully asynchronous nature — through a simpler yet convenient Promises based API.
Kinto.js provides basic local CRUD operations for creating, updating, deleting, retrieving and listing records from a local collection. Each time you want to reflect its state to a remote server, you only ever have to call the sync() method!
We've set up a simple demo application using a public Mozilla test server instance, so you can check how it behaves by yourself if you're interested. The source code of this app is available on Github, and is also the base use case for the Kinto.js tutorial you should probably take if you want to get your feet wet.
Note
Please note that this public Kinto test server instance is flushed every morning at 7AM UTC, so don't rely on it for production use ;)
Synchronizing and reconciling data
Synchronizing local and remote data is a tough topic, and conflicts may occur quite easily if things are changing often from different sources (think multiple devices updating a same server); Kinto.js supports three distinct synchronization strategies to handle such a situation:
- The server is authoritative: all conflicting records are overriden locally by their version from the server;
- The client is authoritative: all conflicting records are resolved using their local versions, and force-pushed to the server;
- No party is authoritative: the synchronization flow is halted, and all conflicting records are explicitely exposed, so developers can then decide how they want resolve each of them individually.
You can read more about conflict resolution and sychronization strategies in the dedicated sections of the project documentation.
The diagram flow below describes pretty much accurately what's happening under the hood when sync() is called:
A case for encryption
Remote data storage is certainly a topic raising concerns when it comes to security and privacy.
To help addressing these issues, Kinto.js exposes a Remote Transformers API, which allow processing records before they're sent to the server and after they've been retrieved from it.
This is a perfect hook for supporting end-to-end encryption, which we already wrote about earlier.
Getting started
We already mentioned the Kinto.js tutorial, but there's more; we've created a rather opinionated Kinto.js + React boilerplate, so you can bootstrap your next offline-first Web application in no time ;)
Current limitations
We've listed Kinto.js current limitations — the ones we're aware of — in a dedicated section of the documentation.
Sure, that's a bunch of work remaining, and you're obviously invited to contribute if you want to help!
The future of Kinto.js
Of course 1.0 is a very first step towards a broader goal; foremost, we absolutely want to support bulk updates by taking advantage of IndexedDB transactions, for performance and consistency purposes.
So stay tuned for next upcoming releases, and feel free to provide feedback on the project mailing-list or by filing an issue on Github :)
Update
We're not even done polishing this blog post and the 1.1 version is already there! Take it the easy way, that means the project is on steroids ;)