Wat is real-time collaboratief bewerken?

Real-time collaboratief bewerken stelt meerdere personen in staat om tegelijkertijd aan hetzelfde document te werken, waarbij de wijzigingen van elke persoon onmiddellijk zichtbaar zijn voor iedereen. Vroege systemen gebruikten Operational Transformation (OT) — een techniek die conflicterende bewerkingen ter plekke opnieuw ordent — maar OT vereist een centrale server om elke wijziging te arbitreren. Moderne systemen zoals Yjs gebruiken Conflict-free Replicated Data Types (CRDTs): een wiskundig raamwerk waarin twee willekeurige replica's in elke volgorde kunnen worden samengevoegd en altijd naar hetzelfde resultaat convergeren, zonder dat een centrale autoriteit hoeft te bepalen wie "wint".

CRDTs maken offline bewerken natuurlijk: gebruikers kunnen blijven bewerken zelfs wanneer ze niet verbonden zijn, en hun wijzigingen worden schoon samengevoegd wanneer ze opnieuw verbinding maken. Dit is waarom real-time collaboratieve editors gebouwd op CRDTs zich onmiddellijk aanvoelen — bewerkingen worden eerst lokaal toegepast en daarna gesynchroniseerd met peers, in plaats van te wachten op een retourrit naar een server voordat ze op het scherm verschijnen.

Hulpmiddelbeschrijving

De Collaborative Code Editor is een real-time multiplayer code-editor aangedreven door Yjs en CodeMirror 6. Deel de kamer-URL met uw teamleden en iedereen in de kamer bewerkt hetzelfde document samen, waarbij de cursor en selectie van elke persoon wordt weergegeven in een gelabeld indicator.

De editor ondersteunt syntaxmarkering voor tientallen programmeertalen, selecteerbaar via een gedeelde taalkeuze — het wijzigen van de taal in één browser werkt onmiddellijk bij voor iedereen in de kamer. Bestanden kunnen vanaf uw lokale schijf worden geladen met de knop Bestand openen en teruggezet met Bestand opslaan.

Functies

  • Live multi-user cursors: De cursor en selectie van elke medewerker worden weergegeven met een kleurgecodeerd, benoemd label; meerdere cursors op dezelfde positie worden samengevouwen tot een enkel "N gebruikers"-indicator om visuele ruis te verminderen.
  • Gedeelde taalselectie: De actieve programmeertaal wordt in de kamer opgeslagen zodat alle deelnemers altijd dezelfde syntaxmarkering zien, en latecomers krijgen onmiddellijk de juiste status.
  • Bestanden lokaal openen en opslaan: Laad elk bronbestand rechtstreeks vanaf schijf in de gedeelde editor, of download het huidige document als bestand met de juiste extensie.

Hoe het werkt

Wanneer u een kamer betreedt, maakt de editor een Yjs-document aan met een gedeeld Y.Text-knooppunt dat de bestandsinhoud vertegenwoordigt. Elke toetsaanslag wordt gecodeerd als een compacte binaire Yjs-update, geserialiseerd naar Base64, en uitgezonden via een WebSocket-kamer. Alle verbonden peers passen de update toe op hun eigen replica; vanwege de CRDT-garantie convergeren alle replica's naar dezelfde tekst ongeacht de volgorde waarin updates aankomen.

Cursor- en selectieposities worden gedeeld via een lichte Awareness-laag die positiegegevens door dezelfde WebSocket-kamer routeert. De volledige documentstatus wordt elke seconde gedempt en naar permanente kameropslag geschreven, zodat gebruikers die na het begin van de sessie toetreden onmiddellijk het huidige document ontvangen.

Opties uitgelegd

  • Taalkeuze — Selecteert de syntaxmarkeringtaal voor de editor. De keuze wordt naar alle kamerleden uitgezonden zodat iedereen consistente markering ziet. De vervolgkeuzelijst is uitgeschakeld totdat u verbonden bent met een kamer.
  • Bestand openen — Opent een lokale bestandskiezer en laadt de tekstinhoud van het geselecteerde bestand in het gedeelde Yjs-document, waarbij de huidige inhoud voor iedereen in de kamer wordt vervangen.
  • Bestand opslaan — Downloadt de huidige editor-inhoud als bestand. De bestandsextensie wordt automatisch gekozen op basis van de geselecteerde taal.
  • Thema — De editor volgt uw systeemvoorkeur voor donker/licht (opgeslagen in localStorage). Schakel uw OS- of browserthema in om te schakelen tussen de VS Code-stijl donkere en lichte editor-thema's.

Beperkingen

  • Een actieve WebSocket-verbinding met de relayserver is vereist voor synchronisatie; als de verbinding verbreekt, worden offline gemaakte bewerkingen automatisch opnieuw gesynchroniseerd wanneer u opnieuw verbinding maakt.
  • Er is geen permanente versiegeschiedenis — zodra een sessie eindigt en de kamer wordt gesloten, is het document weg tenzij u het lokaal hebt opgeslagen met de knop Bestand opslaan.
  • Binaire bestanden (afbeeldingen, gecompileerde binaire bestanden, enz.) kunnen niet worden geladen; de editor werkt alleen met platte tekstbronbestanden.
  • Dit hulpmiddel is in bètafase; kaamerstabiliteit en maximum gelijktijdige gebruikers kunnen beperkt zijn.

Tips

  • Deel de volledige kamer-URL uit de adresbalk van uw browser om medewerkers uit te nodigen — de kamer-ID is in de URL gecodeerd.
  • Sla een lokale kopie op met Bestand opslaan aan het einde van een sessie; kamergegevens zijn niet gegarandeerd om onbeperkt te blijven bestaan.
  • Als het curserlabel van een medewerker belangrijke code bedekt, wordt het label automatisch naar links geklapt wanneer het dicht bij de rechterkant van de editor is.