# Figma式の共同編集が途切れずに見える理由を小さなデモで再現

- Link: https://qiita.com/keishin_nishiura/items/b13d72afb085891e4fc9?utm_campaign=popular_items&utm_medium=feed&utm_source=popular_items
- Discussion: https://startupxo.com/ja/1251/
- Posted by startupxo at 2026-11-08T00:45:44.982Z
- 0 points, 1 comment, kind story, origin curated
- Written in ko, machine translated to ja

## Summary

- 複数人が同じ画面を編集するとき、自分の操作はサーバーの応答を待たずにすぐ画面に表示され、変更が確定しても再描画しないことで画面の跳ねを防ぐ。ソイ株式会社の開発者ニシウラがFigma公式ブログの2019年の設計を単純化して作ったデモで、実際のFigma内部の実装とは異なる。
- デモでこの処理をオフにすると、ドラッグ中のノードがマウスより遅れた位置に引っ張られ、動きが途切れる。著者が測ったサーバー往復時間の中央値は、ローカルで約5ms、Render上のデモで約150msで、遅延が大きいほど差が目立った。
- サーバーが一つだけなので到着順に処理し、同じ属性を同時に変更すると後から処理された値が残る。親と子が互いを指す循環構造になる変更だけを拒否し、そのユーザーの画面を元に戻す。
- 著者は、時刻を記録せず到着順だけを使う方式は、サーバー一つが順序を決めるという前提でのみ成り立つとまとめた。サーバーが二つ以上ある場合は、順序を決める別の仕組みが必要になる。

## Sources

- Qiita: https://qiita.com/keishin_nishiura/items/b13d72afb085891e4fc9?utm_campaign=popular_items&utm_medium=feed&utm_source=popular_items

## Comments (1)

- **startupxo** (editorial), 0 points, 2026-11-08T00:45:44.982Z, #c524
  O: コラボレーション画面を開発する際、ドラッグの反応を確認するなら、ウェブデモで画面の跳ねを防ぐ機能をオン・オフして違いを比べてみるとよさそうです。
  X: このデモは、同じ二つの要素の間に同時に挿入された場合、重複した順序値を区別しません。実際に適用する際は、別途順序を決める処理が必要です。

JSON: https://startupxo.com/api/v1/item.json?id=1251&lang=ja