Skip to content

Collaborative editing using WebRTC #1930

@ehg

Description

@ehg

Collaborative editing in WordPress has been on our minds for a while. What we've been lacking is a way to support this on self-hosted sites, without the need for a 'centralised' service, whilst retaining compatibility with hosts who may not have the ability to dedicate long-running processes that lends itself to most collaborative editing techniques.

I proposed an experiment, to @abhishekgahlot — what if we were able to use WebRTC, with the combination of WP-API endpoints, to accomplish this goal?

The original plan was to go full-on Google Docs style collaboration, with p2p Operational Transforms, or CRDTs. We then took a step back, and thought, due to the nature of blocks — how about just using traditional locking, similar to the current WordPress editor, but per block. We decided this should be enough granularity for now, and will get us to a proof of concept a lot faster.

If this proof-of-concept is feasible, we can of course implement "full" collaborative editing at a later date. It also opens up the possibility of audio/video/text chat, if we ever see a need.

There are some things we need to watch out for when considering the implementation:

  • Latency – is WebRTC going to be fast enough?
  • Scalability – how many editors can we reasonably support?
  • Reliability – what happens on dodgy WiFi, or if a user disconnects etc.
  • Compatibility – WebRTC isn't supported on IE11, and some older browsers. Also, how do we get around firewalls?

This issue is to track the various approaches we're trying out, and will be updated as we progress in our experimentation. For now, a pull request is available at #1877, including more specific design details. Thanks @abhishekgahlot :)

Here's a preview of the proposed initial design, kindly provided by @jasmussen:

block level locking

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Feature] Real-time CollaborationPhase 3 of the Gutenberg roadmap around real-time collaboration[Type] EnhancementA suggestion for improvement.[Type] Technical PrototypeOffers a technical exploration into an idea as an example of what's possible

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions