yjsについて調べる
bisqueyjs
A CRDT framework with a powerful abstraction of shared data
共有データの強力な抽象化を備えた CRDT フレームワーク
bisqueCRDTってなんだろう
Conflict-free replicated data types (CRDT)
競合のない複製されたデータ型 らしい。
共有データアルゴリズムの対比としてoperational transformation (OT) がある。
- OT: 中央サーバーがデータを管理。
- CRDT: 分散システムに適している。
説明の意味は、まだ知識が浅く理解できない。
bisque平たくいうとyjsはCRDTの実装らしい。テキスト編集に適したように、アルゴリズムは多少変更しているらしい。
bisqueCRDT 実装のベンチマーク
yjsはバンドルサイズが他の競合に比べて桁１つ小さい。
スコアは項目によってばらつきが大きい。
bisque（めちゃくちゃ雑な理解）yjsは他のクライアントとデータ同期する際に差分を交換して最新の状態を作る。データのidにはclient識別子とLamport timestampの組み合わせが使われる。
bisqueOverview
ネットワーク機能とバインディング機能は別のモジュールに分離されている。
通信はwebsocketだけでなくwebrtc, p2pなど様々な方法があるらしい。
bisque共有可能なタイプ
Array, Map, Text, XmlFragment, XmlElement がある
bisque開発者向けドキュメント
bisqueバインディング
CodeMirrorの例
実装コードはとても小さい。どうやってインターネット上の相手を特定するんだろう。
bisqueシグナリングサーバーというサーバーが必要。
同じシグナリングサーバーに接続するピアは、他のユーザーを認識できるらしい。
シグナリングサーバーの実装例
topic（共同編集の対象）をサブスクライブして、イベントがあったらサブスクライバーにメッセージを送るような仕組みらしい。ここでユーザーを特定して共有範囲を制御できそう。
WebRTCのサンプルのはずがWebSocketで実装されている。WebRTCがよくわかってない。
シグナリングサーバーのサーバーレス環境の実装例
こちらはシグナリングサーバーがWebRTCで実装されている。
こちらでもAPI GatewayのWebSocket APIが使われている。
bisqueWebRTCの概念としては、中央サーバーを介さずにピア同士がデータの送受信ができる技術らしい。
bisqueWebSocketは、ブラウザとサーバー間の双方向の通信セッションを開くもの。
bisque話をy-webrtcに戻る。
このサンプルは、シグナリングサーバーはWebSocket、yjsのデータ通信はWebRTCという組み合わせで実装されているということが分かった。
シグナリングサーバーの publish イベントとはなんなのだろう。
ここで送信されている。y-webrtc.js の内部実装の話なので一旦置いておこう。
bisqueDatabase Providorなんていうものもある。
共有データを保存しておくストレージのプロバイダらしい。オフラインにも対応できる。CRDT はあとから差分が発生してもマージできるらしい。
bisqueyjsの概念がふわっとわかった。次はCodeMirrorのリアルタイムコラボレーションのデモを実装してみようかな。