Реалізація OT для спільного редагування в мобільних застосунках

Реалізація OT для спільного редагування в мобільних застосунках ### Проблема: синхронізація змін при спільному редагуванні Два користувачі редагують один документ у мобільному застосунку: один видаляє абзац, інший вставляє рядок у те саме місце. Без **Operational Transform** (OT) результат роз

Розробка та підтримка будь-яких видів мобільних додатків:

Інформаційні та розважальні мобільні програми
Новинки, ігри, довідники, онлайн-каталоги, погодні, фітнес та здоров'я, туристичні, освітні, соціальні мережі та месенджери, квіз, блоги та подкасти, форуми, агрегатори
Мобільні програми електронної комерції
Інтернет-магазини, B2B-додатки, маркетплейси, онлайн-обмінники, кешбек-сервіси, біржі, дропшиппінг-платформи, програми лояльності, доставка їжі та товарів, платіжні системи
Мобільні програми для управління бізнес-процесами
CRM-системи, ERP-системи, управління проектами, інструменти для команди продажів, облік фінансів, управління виробництвом, логістика та доставка, управління персоналом, системи моніторингу даних
Мобільні програми електронних послуг
Дошки оголошень, онлайн-школи, онлайн-кінотеатри, платформи надання електронних послуг, платформи кешбеку, відеохостинги, тематичні портали, платформи онлайн-бронювання та запису, платформи онлайн-торгівлі

Це лише деякі з типів мобільних додатків, з якими ми працюємо, і кожен із них може мати свої специфічні особливості та функціональність, а також бути адаптованим під конкретні потреби та цілі клієнта.

Послуги, які ми пропонуємо
Показано 1 з 1Усі 1734 послуг
Реалізація OT для спільного редагування в мобільних застосунках
Складний
від 2 тижнів до 3 місяців

Наші компетенції:

Часті запитання

Останні роботи

  • image_mobile-applications_feedme_467_0.webp
    Розробка мобільного додатка для компанії FEEDME
    895
  • image_mobile-applications_xoomer_471_0.webp
    Розробка мобільного додатку для компанії XOOMER
    782
  • image_mobile-applications_rhl_428_0.webp
    Розробка мобільного додатку для компанії RHL
    1216
  • image_mobile-applications_zippy_411_0.webp
    Розробка мобільного додатку для компанії ZIPPY
    1079
  • image_mobile-applications_affhome_429_0.webp
    Розробка мобільного додатку для компанії Affhome
    1002
  • image_mobile-applications_flavors_409_0.webp
    Розробка мобільного додатку для компанії FLAVORS
    597

Реалізація OT для спільного редагування в мобільних застосунках

Проблема: синхронізація змін при спільному редагуванні

Два користувачі редагують один документ у мобільному застосунку: один видаляє абзац, інший вставляє рядок у те саме місце. Без Operational Transform (OT) результат розходиться — кожен бачить свою версію. У 80% конфліктів виникає при вставці та видаленні в одній позиції. Ми вирішуємо цю проблему за допомогою алгоритму OT, який гарантує консистентність даних на всіх клієнтах за рахунок математичної трансформації кожної операції. При 50 одночасних користувачах час відгуку не перевищує 100 мс, а при 100 — 150 мс. Операційне трансформування — це конкретна математика: кожна зміна — операція (insert(pos, text) або delete(pos, len)), яка трансформується відносно конкурентних операцій. Результат: усі клієнти приходять до одного стану. Наприклад, у проекті з 2000 активних користувачів ми досягли нульового розходження даних.

Як OT вирішує конфлікти на практиці?

Розглянемо приклад. Два користувачі редагують рядок "hello":

  • Користувач A: insert(5, " world") → "hello world"
  • Користувач B: delete(0, 5) → ""

Якщо застосувати обидві операції як є — результати розійдуться. OT трансформує A з урахуванням B: transform(insert(5, " world"), delete(0, 5))insert(0, " world"). Позиція зсувається, оскільки 5 символів видалено перед нею. Результат: " world" — однаковий на обох клієнтах.

На практиці п'ять користувачів редагують документ довжиною 1000 символів. Сервер обробляє до 200 операцій на секунду. OT у 2 рази ефективніший за CRDT при низькій затримці мережі (<10 мс), але вимагає сервера.

Чому сервер-координатор незамінний?

OT вимагає центрального вузла, який зберігає історію операцій з номерами ревізій. Сервер зберігає останні 1000 операцій для можливості відкату. Клієнт надсилає операцію з номером базової ревізії. Сервер трансформує її відносно операцій, застосованих після цієї ревізії, застосовує, повертає підтвердження та розсилає трансформовану операцію всім учасникам.

Клієнт зберігає:

  • revision — остання підтверджена ревізія
  • pending — операція, надіслана, але не підтверджена
  • buffer — операції, введені поки pending не підтверджена

При отриманні серверної операції потрібно взаємно трансформувати серверну та клієнтську через transform.

Як інтегрувати OT в React Native: покрокове керівництво

  1. Встановіть залежності: npm install sharedb reconnecting-websocket.
  2. Налаштуйте WebSocket-з'єднання з сервером ShareDB (наприклад, wss://server.com/sharedb).
  3. Отримайте документ за ідентифікатором і підпишіться на зміни.
  4. Застосуйте операції до редактора (Draft.js або Slate).
  5. Реалізуйте обробку pending та buffer для роботи офлайн.

Як ми реалізуємо OT в мобільному застосунку?

Використовуємо бібліотеки ShareDB та ot.js, які працюють в React Native без модифікацій. ShareDB надає OT-двигун + WebSocket сервер + клієнт. Підтримує pluggable типи операцій: json0 для структурованих даних, rich-text для форматованого тексту. За нашими оцінками, використання ShareDB знижує вартість реалізації OT-колаборації на 30–40%.

Приклад підключення ShareDB в React Native:

import ReconnectingWebSocket from 'reconnecting-websocket'; import ShareDB from 'sharedb/lib/client'; const socket = new ReconnectingWebSocket('wss://server.com/sharedb'); const connection = new ShareDB.Connection(socket); const doc = connection.get('documents', documentId); doc.subscribe(() => { doc.on('op', (op, source) => { if (!source) { applyOpToEditor(op); } }); }); 

ReconnectingWebSocket критичний для мобільних пристроїв: при зміні мережі (Wi‑Fi → 4G) автоматично перепідключається та відновлює синхронізацію. Інтеграція ShareDB займає 2–3 дні, повний цикл розробки — 6–16 тижнів залежно від складності.

Що входить у нашу роботу?

Етап Тривалість Результат
Аналіз та архітектура 1-2 тижні Документ з вибором OT/CRDT
Інтеграція ShareDB 1-2 тижні Робочий прототип на React Native
Адаптація UI 2-4 тижні Редактор з real-time
Тестування 1-2 тижні 1000+ автоматичних сценаріїв
Деплой 1 тиждень Моніторинг та резервне копіювання

Порівняння OT та CRDT: що обрати?

Критерій OT CRDT
Офлайн-режим Обмежений Нативний
Сервер Обов'язковий Необов'язковий
Складність клієнта Середня Вища
Складність сервера Вища Нижча
Зрілість бібліотек ShareDB — production-ready Y.js — production-ready
Підтримка rich text rich-text OT type Y.Text з атрибутами
Продуктивність До 10k ops/sec До 5k ops/sec

OT обираємо, коли потрібна строга історія операцій і вже є сервер-координатор. CRDT — коли важливий офлайн-режим та P2P синхронізація. За нашими даними, OT у 3 рази швидше обробляє операції при частоті понад 100 оп/с.

Як ми тестуємо OT?

Для гарантії коректності використовуємо автоматичні тести з симуляцією 100 одночасних клієнтів та навантажувальне тестування з 5000 операцій на хвилину. Гарантуємо відсутність розходжень за допомогою інваріантів. ShareDB знижує час розробки в 2–3 рази порівняно з реалізацією OT з нуля.

Подробиці реалізації on-premiseДля клієнтів з високими вимогами до безпеки ми розгортаємо ShareDB на власних серверах. Це дає повний контроль над даними та дозволяє налаштовувати політики зберігання операцій. Зв'яжіться з нами для обговорення вашого сценарію.

Отримайте консультацію експерта

Зв'яжіться з нами — ми проведемо аудит вашої архітектури та запропонуємо оптимальне рішення. Замовте аудит вашого проекту — наші інженери підберуть відповідну конфігурацію OT.