Client
Storage

Storage

Each client has the option for how they would like to store their data.

Memory

If you would only like to store data ephemerally, you can use the memory storage engine. This will store your data in memory and will not persist across page refreshes.

If you use memory storage for your outbox, data may be lost if the user refreshes the page before the data is sent to the server.

If no storage options are provided this is the default.

const client = new TriplitClient({
  storage: 'memory',
});
 
// Which is equivalent to
 
import { MemoryBTreeStorage as MemoryStorage } from '@triplit/db/storage/memory-btree';
 
const client = new TriplitClient({
  storage: {
    outbox: new MemoryStorage(),
    cache: new MemoryStorage(),
  },
});

IndexedDB

If you would like to persist data between refreshes in the browser you can use the IndexedDB storage engine. This will store your data in the browser's IndexedDB database.

To improve performance, data is also cached in memory.

const client = new TriplitClient({
  storage: 'indexeddb',
});
 
// Or provide your own name
 
const client = new TriplitClient({
  storage: {
    type: 'indexeddb',
    name: 'my-database',
  },
});
 
// Or provide your own instances (not possible with the WorkerClient)
 
import { IndexedDbStorage } from '@triplit/db/storage/indexed-db';
 
const client = new TriplitClient({
  storage: {
    outbox: new IndexedDBStorage('my-database-outbox'),
    cache: new IndexedDBStorage('my-database-cache'),
  },
});

Note that passing storage: 'indexeddb' to the constructor will create IndexedDB databases using the names 'triplit-outbox' and 'triplit-cache'. If your application connects to multiple projects with separate clients, we recommend you create your own custom-named instances of IndexedDBStorage so that naming conflicts do not occur.

Sqlite

In the browser

Triplit does not currently provide a Sqlite storage adapter for the browser. The Triplit server, which runs in node environments, can use the sqlite storage engine.

In React Native

Triplit provides an expo-sqlite storage adapter for React Native applications. This adapter uses the expo-sqlite (opens in a new tab) package to store data on the device. Users of Expo 51 or greater can get started by importing the storage provider from @triplit/db/storage/expo-sqlite:

import { ExpoSQLiteStorage } from '@triplit/db/storage/expo-sqlite';
import { TriplitClient } from '@triplit/client';
 
new TriplitClient({
  storage: {
    cache: new ExpoSQLiteStorage('cache.db'),
    outbox: new ExpoSQLiteStorage('outbox.db'),
  },
});

You may also instantiate the storage provider with an existing database instance:

import { ExpoSQLiteStorage } from '@triplit/db/storage/expo-sqlite';
import * as SQLite from 'expo-sqlite';
import { TriplitClient } from '@triplit/client';
 
const cacheDB = SQLite.openDatabaseSync('cache.db');
const outboxDB = SQLite.openDatabaseSync('outbox.db');
 
new TriplitClient({
  storage: {
    cache: new ExpoSQLiteStorage(cacheDB),
    outbox: new ExpoSQLiteStorage(outboxDB),
  },
});

Users of Expo 50 or below can use the storage provider exported by @triplit/db/storage/expo-sqlite-legacy.

As well if there is a SQLite library that we don't yet have a storage provider for, you can create your own by implementing the SQLiteAdapter interface and providing that to AdapterSQLiteStorage available in @triplit/db/storage/adapter-sqlite. Here is a gist (opens in a new tab) implementing an adapter for op-sqlite, another SQLite library for React Native.

Clearing your database

To clear a TriplitClient's database, you can call the clear method. The clear takes an optional parameter full which if set to true will clear the entire database including all schema and metadata. If full is set to false or not provided, only your applicaiton data will be cleared. Clearing this data will not sync, so it is useful if you need to purge the data on your client.

const client = new TriplitClient({
  storage: 'indexeddb',
});
 
const full: boolean = ...;
async function clearCache() {
  await client.clear({ full });
}

If you are clearing your cache because a user is signing out, it is recommended to use client.reset() as explained in the auth guide.