HNで公開: Triplit – サーバーとクライアントで動作するオープンソース同期データベース
(github.com/aspen-cloud)Triplit の概要
Triplit は、サーバーとブラウザー間でデータをリアルタイムに同期するオープンソースのデータベースです。TypeScript パッケージとして提供され、サーバーにデータを保存し、クライアントへインテリジェントに同期します。
- リアルタイム同期: プロパティレベルでの増分更新と競合解決を提供
- ローカルキャッシュ: クライアント側データベースとして動作
- 耐久性のあるサーバー側ストレージ: 管理ダッシュボードを含む
- プラグイン型ストレージプロバイダー: SQLite、IndexedDB、LevelDB、Memory などをサポート
- 楽観的更新: 高速なインタラクションを提供
- リレーショナルクエリ: 複雑なデータモデルをサポート
- オフラインモード: 自動再接続と一貫性を保証
- ロールバックと再試行の管理: 更新失敗時に対応
- スキーマ: データの安全性と TypeScript 自動補完を提供
- 権限管理: サーバーで読み取り・書き込み権限を強制
- コラボレーション / マルチプレイヤー: CRDTs で動作
- 低レイテンシ: デルタパッチを使った最小限のネットワークトラフィック
- シンプルな API: JavaScript と React でのデータクエリおよび変換をサポート
- 完全なオープンソース
Monorepo の概要
triplit/packages には、Triplit を支えるさまざまなプロジェクトが含まれています。
- TriplitDB: ブラウザー、Node、Deno、React Native などあらゆる JS 環境で実行可能で、ネットワーク上の複数の書き手間で一貫性を維持しながら、高速かつリアルタイムに更新されるクエリを提供
- Client: ローカルおよびリモートの TriplitDB と相互作用するブラウザーライブラリ
- CLI: プロジェクトのスキャフォールディング、フルスタック開発環境の実行、サーバーマイグレーションなどのためのコマンドを提供
- React: @triplit/client のための React バインディング
- Svelte: @triplit/client のための Svelte バインディング
- Console: Triplit プロジェクトのデータ閲覧・変換、スキーマ管理アプリ
- Server: Triplit クライアント間のデータ同期のための Node サーバー
- Server-core: Triplit を実行するサーバーを構築するためのプロトコル非依存ライブラリ
- Docs: Nextra で構築された Triplit ドキュメント
- Types: さまざまな Triplit プロジェクト向けの共有型
- UI: shadcn で構築された Triplit フロントエンドプロジェクト向けの共有 UI コンポーネント
クイックスタート
新しいプロジェクトを開始:
npm create triplit-app@latest my-app
既存プロジェクトに依存関係を追加:
npm install --save-dev @triplit/cli
npm run triplit init
スキーマ定義 (my-app/triplit/schema.ts):
import { Schema as S, ClientSchema } from '@triplit/client';
export const schema = {
todos: {
schema: S.Schema({
id: S.Id(),
text: S.String(),
completed: S.Boolean({ default: false }),
}),
},
} satisfies ClientSchema;
Triplit 開発同期サーバーを起動:
npm run triplit dev
環境変数を設定 (.env ファイル):
VITE_TRIPLIT_SERVER_URL=http://localhost:6543
VITE_TRIPLIT_TOKEN=copied-in-from-triplit-dev
アプリでクエリを定義 (React の例):
import { TriplitClient } from '@triplit/client';
import { useQuery } from '@triplit/react';
import { schema } from '../triplit/schema';
const client = new TriplitClient({
schema,
serverUrl: import.meta.env.VITE_TRIPLIT_SERVER_URL,
token: import.meta.env.VITE_TRIPLIT_TOKEN,
});
function App() {
const { results: todos } = useQuery(client.query('todos'));
return (
<div>
{Array.from(todos.values()).map((todo) => (
<div key={todo.id}>
<input
type="checkbox"
checked={todo.completed}
onChange={() =>
client.update('todos', todo.id, (todo) => ({
todo.completed = !todo.completed,
}))
}
/>
{todo.text}
</div>
))}
</div>
);
}
アプリを起動し、別のブラウザータブを開いてリアルタイムのデータ同期を確認します。
GN⁺ の意見
- Triplit はリアルタイム同期とローカルキャッシュを組み合わせることで、高速かつ一貫したユーザー体験を提供します。
- さまざまなストレージプロバイダーをサポートしており、柔軟なデータ管理が可能です。
- オフラインモードと自動再接続機能により、ネットワークが不安定な状況でもデータの一貫性を維持します。
- シンプルな API と多様なフレームワーク対応により、開発者にとって扱いやすいです。
- ただし、初期設定や環境変数の管理はやや複雑になる場合があります。
1件のコメント
Hacker Newsの意見
Triplitの使用経験の共有: Triplitをプロジェクトで使用しており、データモデルは分散型(P2P)によく適している。ただし、サーバー認証トークンの生成とクエリ言語の表現力不足が惜しい。
Evoluとの比較: TriplitとEvoluの違いとして、Triplitの
.subscribe()機能、Evoluの高度なクエリ機能(SQLベース)、およびブラウザで使用するデータベースの種類が異なる。オフライン同期とスキーマ進化: オフライン同期プロトコルを使用するデータベースで、クライアントのバージョンが異なる場合にスキーマ進化の問題をどのように解決するのか気になる。
クライアントがデータベースに直接書き込むことへの疑問: クライアントがデータベースに直接書き込むことが許されるアプリが理解できない。SupabaseやFirestoreについても同じ疑問がある。
Triplitのユーザー設定管理: Triplitを使ってユーザー設定を管理しており、オフラインでもアプリがうまく動作するようにしている。サポートチームの迅速な対応が印象的。
AGPLライセンスを選んだ理由: TriplitがAGPLライセンスを選択した理由が気になる。
ローカルファーストのアプローチ: ローカルファーストのアプローチをモバイルアプリで使用しており、他のソリューションと比べてTriplitがクライアント・サーバー同期ソリューションを提供する理由が気になる。
Rustバインディングの要望: Rustバインディングが追加されればTauriと一緒に使うことができ、オフラインファーストアプリの開発に役立つはず。
React NativeでのTriplit使用経験: TriplitをReact Nativeアプリで使用しており、クエリ言語、TypeScriptサポート、オフラインサポート、React Nativeサポートが優れている。オープンソースであり、セルフホスティング可能な点も長所。
未来のアプリ開発: Triplitはアプリ開発の未来のように感じられるが、RethinkDBとの比較や、彼らが失敗した理由についてどう考えるか気になる。
MongoDBとTriplitの組み合わせ可能性: サーバー側でMongoDBを使い、React側でTriplitを使えるのか、それともTriplitを新しいデータベースとして使う必要があるのか気になる。