Sebastian Salzgeber: Ajax Colaborative Editing — vulgo: „So wie bei Google Wave“

Hallo nochmal

Da mir Sven vorhin so schnell helfen konnte, habe ich den Sonntag Abend quasi frei und recherchiere jetzt schon seit einigen Stunden, wie collaborative editing* mittels Ajax funktioniert.
Ich muss sagen, ich hätte gedacht, dass das Thema nach google wave schon tiefer durchgekaut wäre. Diverse Seiten erwähnen es, aber keiner nennt klassen oder scripte die diese funktion bereits umsetzen.
Es gibt tolle jQuery Ajax Request-Beispiele bei denen die Eingaben eine 'Ehrenrunde' durch ein PHP-Script laufen bevor sie mittels JS in das Dokument wieder eingebunden werden. Das sind aber quasi nur die äusseren Enden für diese Funktion. Interessant wäre eben das Herz, wo ich die eigentliche Leistung in so einer Funktion vermute. Auf einigen Seiten las ich, dass eines der trickreichsten Stellen wohl jene sei, auseinanderzuahlten wer wann wo an welcher Stelle was schreibt und welche auswirkung das auf die schreibposition des Mitschreibers hat bzw auf seine Backspace-Befehle.

Ist jemand schoneinmal über eine (jQuery) implementierung von collaborative editing gestolpert wo jemand das dokumentiert hat, wie man da ran geht (oder gibt es gar schon robuste scripte dafür)?

Ich habe google mitlerweile danach ausgewrungen und frage deshalb hier.

Grüße
Sebastian S.

*Mit 'collaborative editing' meine ich die Funktion, dass mehrere User gleichzeitig an einem Text arbeiten können und beim tippen der text asap auch für den Mitschreiber sichtbar ist. Google Wave hat dieses Feature ja quasi Aufgezeigt.

  1. Auf einigen Seiten las ich, dass eines der trickreichsten Stellen wohl jene sei, auseinanderzuahlten wer wann wo an welcher Stelle was schreibt und welche auswirkung das auf die schreibposition des Mitschreibers hat bzw auf seine Backspace-Befehle.

    Ich habe noch keine triviale, fertige Implementierung von so etwas gesehen. jQuery wird da einem auch wenig weiterhelfen. Das ist auch kein reines clientseitiges JavaScript-Problem, sondern bedarf einer Client und Server übergreifenden Logik betreffend Ändern, Speichern und Austausch der Änderungen. Den clientseitigen Part, Knoten eindeutig zu adressieren und Änderungen darin zu verteilen, stelle ich mir noch am einfachsten vor - zumindest, wenn man es rudimentär umsetzt. Dazu kommen noch unzählige andere Module, bis man das hat, was man von Google Wave kennt.

    Es gibt zwei Open-Source-Projekte, die collaborative editing erlauben:
    http://code.google.com/p/etherpad/
    http://mozillalabs.com/bespin/

    Die sind ein wilder Mix aus Server- und Clientcode, zudem funktioniert Bespin komplett auf Canvas anstatt in einem HTML-DOM. Ob man da den relevanten Code findet und gar extrahieren kann, weiß ich nicht.

    Mathias

    1. Das ist auch kein reines clientseitiges JavaScript-Problem, sondern bedarf einer Client und Server übergreifenden Logik betreffend Ändern, Speichern und Austausch der Änderungen.

      Hab vielen Dank für deinen Hinweis. Ich ging natürlich davon aus, dass es ein server-seitiges script brauchen wird. Es gibt halt gute Beispiele für "inline editing" in ajax wo halt ein kleiner ansatz zu sehen ist wie es funktionieren kann.

      Da ich mitlerweile versuche soetwas mal selber von neuem zu coden (Dieses Rad scheint ja noch nicht erfunden) würde ich gerne deine Meinung dazu hören, wie du glaubst das man die Werte abfragen sollte.
      Ich las dass einige es via Datenbank-Abfrage machen. Aber ich würde ungern die MySQL-DB im (mindestens) Sekundenrakt pollen um updaten zu holen. Andere schrieben, dass eine PHP Methode über fopen und eine Datei zum Auslesen besser wäre. Was denkst du? Wäre ein Datenbank-Polling besser als eine Datei aus der man die updates bezieht?
      Oder dritte möglichkeit (die mir gerade einfällt) gibt es vielleicht eine Datenbank die genau auf sowelchen schnellen updates ausgerichtet ist (Postgree? Ado?). SQLlite ist ja nur eine kleine Version von MYSQL die man leicht in eine Applikation implementieren kann, die aber wie seine grosse Schwester performancemässig Skaliert.

      Die Frage geht natürlich auch an alle anderen.

      Grüße
      Sebastian S.

      1. Hallo,

        Ich las dass einige es via Datenbank-Abfrage machen. Aber ich würde ungern die MySQL-DB im (mindestens) Sekundenrakt pollen um updaten zu holen.

        Das meine ich ja mit »übergreifenden Logik betreffend Ändern, Speichern und Austausch der Änderungen«. Man pollt natürlich nicht ständig das gesamte Dokument. Stattdessen werden Änderungen z.B. über Long-Polling Ajax an die Clients verteilt. Also brauchst du eine Art Diff-Format, um Änderungen an einzelnen Zeichen schnell zu übertragen und anzuwenden. Beim Vornehmen von Änderungen schickt der Client ebenfalls entsprechende Diffs.

        Ich habs nicht geprüft, aber ich nehme mal stark an, dass Google Wave & Co. nicht das gesamte Dokument, sondern nur die relevanten Teile hin und her schicken.

        Oder dritte möglichkeit (die mir gerade einfällt) gibt es vielleicht eine Datenbank die genau auf sowelchen schnellen updates ausgerichtet ist (Postgree? Ado?).

        Um serverseitige diese Diffs vorzuhalten, reicht wohl ein ordinärer Memcache oder spezielle Datenbanken wie Redis und MongoDB. Ab und an kannst du Snapshots des gesamten Dokuments auf Festplatte bzw. in einer SQL-Datenbank speichern - gebraucht wird das gesamte Dokument eigentlich nur, wenn jemand den Editor startet, von dort an werden Diffs ausgetauscht.
        Eine SQL-Datenbank für die vielen kleinen Diffs hingegen scheint mir zu hoch gegriffen. Die NoSQL-Datenbanken sind für solch performante Anwendungen stark im Kommen. Aber da bin ich kein Experte.

        Mathias

        1. Ich habs nicht geprüft, aber ich nehme mal stark an, dass Google Wave & Co. nicht das gesamte Dokument, sondern nur die relevanten Teile hin und her schicken.

          GoogleWave ist ein XMPP-Dienst, sie schicken als auf jeden Fall XML-Päckchen hin und her. Da böte es sich zumindest an das Dokument einfach entsprechend in Knoten zu Organisieren (also auch innerhalb der Blimps oder wie das heißt) und diese entsprechend zu aktualisieren.
          XMPP braucht natürlich auch nicht pullen, da kann man auch einfach die Ports offen halten. Im Webinterface natürlich nicht :)

          --
          sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
  2. Hi,

    Ich muss sagen, ich hätte gedacht, dass das Thema nach google wave schon tiefer durchgekaut wäre.

    heise.de: Google Wave wird eingestellt

    Wenn schon der Marktführer damit keinen Erfolg hatte, glaube ich erst mal nicht, dass es da in absehbarer Zeit noch viel Durchkaubedarf gibt.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    1. Hallihallo!

      Wenn schon der Marktführer damit keinen Erfolg hatte, glaube ich erst mal nicht, dass es da in absehbarer Zeit noch viel Durchkaubedarf gibt.

      Wobei ich aber nicht der Meinung bin, dass der Misserfolg an einer schlechten Idee oder Umsetzung liegt.
      Ich glaube vielmehr, dass (noch?) einfach die praktische Anwendung für einen solchen Dienst im Onlinebereich fehlt.
      Für ein In_tra_net stelle ich mir Wave sehr interessant, spannend, und sehr nützlich vor.

      Beste Grüsse,
          Tobias Hahner