WYSIWYG Editors and Collaborative Edit Safety

I’ve never heard of ScuttleButt before, that name is just too silly to take seriously :laughing: just tried the r-edit demo, it works nicely with plaintext. Doesn’t seem like the most data-efficient method though, at least not in the r-edit example, it sends over data between each line-break. So if you start a new line, then type a 800 character paragraph without ever hitting “enter”, it’s sending over all 800 characters until you hit it and start a new line. Do you know if that’s the default, or just the implementation of that simple demo?

edit: looks like there’s another example that’s “character-wise” and doesn’t send down the entire line

@funkyeah Hmm, I could certainly be off my rocker, but from what (granted, little) I know about Quill, I think it and CK5 are orders of magnitude apart. CK5 is off to the races with OT already:
https://github.com/ckeditor/ckeditor5-core/blob/master/src/treemodel/operation/transform.js

Collaboration is top of their list as far as what they’re excited about OT enabling. From the Medium article I linked above:

Collaborative editing: this is the first obvious benefit that OT brings and a feature that we want, a lot!

As I recall, their lead JS dev, Piotr Koszulinski, hacked together a collaborative editing demo with CK4 on a lark, and I’ve seen him comment multiple times on his interest and intention in this area. He (and maybe some other of the team?) are members of the W3C Editing Taskforce, working directly with browser vendors.

Setting aside OT and collaborative editing, CK5 will offer a raft of functionality not addressed by Quill. Off the top of my head, in no particular order:

  • Full-page, inline editing of native DOM—via their custom data model
  • Highly polished widget system
  • A rich plugin API
  • (If CK4 is an indication) exhaustive documentation
  • Full support for accessibility standards
  • Fantastic paste-from-MSword cleanup (If you’ve ever had to answer to real users of rich-text editors, you know why this is huge :slight_smile: )
  • Decoupled interface
  • Excellent content filtering so you can easily enforce rules about your allowed DOM entities and attributes
  • Alternate data formats out of the box (Markdown, etc.)

Whew, looking at all that, I feel I should clarify that I don’t mean to pile it on or come off as rah-rah! I think it is worthwhile though to give this team their due and look deeply into what they’re up to. I think a lot of folks dismiss CK5 because of the legacy of TinyMCE and (F)CKEditor, assuming it will be another bloated spaghetti-code mess. But the truth is this team is more aware of the dark days of rich-text editors than any of us could possibly be, and have the experience, wherewithal and commitment to build a stellar solution.

And, all that said, I don’t want to pour cold water on the discussion of other RTE projects being discussed here. I just am all too keenly aware of how many hot, new RTE projects have come and gone over the last few years. :slight_smile:

1 Like

Found a better source confirming that CK5 will have OT and collaborative editing out of the box.

Here is one I’ve been looking at for a while. Haven’t gotten to the point yet where I need it in my project but I believe it does all of what you’re looking for. Saw it on a meteor night from last year:

@dtwist it looks as though I may stand corrected about how core OT integration is for CK5.

The more I dig into it the more I like it and there is a lot to be said about having the backing of a full-team. As you mentioned though it hasn’t been released yet. There is no official time-frame and following their updates it looks like it may be at least a few months yet before we see any sort of stable release.

My opinion is that at least for now Prosemirror is the most viable option.
@efrancis, @mitar, @dtwist, @archonic, @garrilla, @sylvain and anyone else interested… I am going to propose starting a Meteor 1.3 package for Prosemirror integration with code living at https://github.com/prosemeteor/prosemirror

The short-term plan would be:

  1. discuss architecture and approach (in a github issue, wiki, or at humon)
  2. Setup basic non-realtime 1.3 demo app
  3. Work on server side integration and code
  4. extend demo app to be collaborative
  5. identify and prioritize additional features

If anybody is A) on-board with this plan and B) interested I helping, let me know (and send me your github username) and I’ll start adding people to the repo. If not I am all ears on alternative approaches that we could start working on.

1 Like

Yeah I think CK5 sounds great, but I personally don’t want to wait 6+ months for their work to reach maturity. Humon looks pretty awesome! I’m up for that, or a GitHub wiki. I think if we do use Humon we should still make a GitHub wiki and just link to the Humon since most ppl will probably see the GH first. Your short-term plan sounds about right, can you create the place for us to start discussing architecture and higher-level design?

@funkyeah Yup, CK5 is definitely not your answer if you really need something right now, and/or your requirements for RTE are minimal. For my projects’ purposes, I can wait the 4-8 months for CK5 to get to a usable state (and save tearing my hair out solving problems that CK5 should solve for me) while I commit resources to other projects. The stuff I need rich-text for requires most of the items I listed above (real-time collab is a nice-to-have for me), and building those from the foundation up is not economically feasible.

I’ll definitely monitor your progress on a Prosemirror integration, but I can’t commit the time to join efforts. Nor am I certain I’d have much to contribute at this point—I’m just getting my feet wet with Meteor. My intent with jumping into this thread was just to bring CK5 to the conversation, for those who might benefit. :slight_smile:

@efrancis let me know if I added the right github user

Don’t even remind me. :wink: Yeah this is an awesome feature.

I’d mention great, well thought out contentEditable mode too.

1 Like

@funkyeah Totally on-board. I’m “archonic” on github. Authorship and being able to associate items with regions of content, even after changes are high priorities. Real-time collab is a must for me. I’m hoping to be able to “reach in to” the content and setup events for various purposes. Example: editing the content of a header which would simultaneously update a dynamic table of contents. I’ve had a lot of experience with TinyMCE and CKEditor and don’t really like either. Trix has the right approach to images and otherwise favourable implementation. I haven’t looked into CKE5 though, maybe it fits the bill.

Cool, I’ll add you to the org I created for this project.

Curious, could you explain a bit more what you mean by associating items with regions of content? (Like a comment system?)

I’m not sure if the other two items you mention will be coming down the road for Prosemirror core, but I would almost guarantee the API would allow for the addition of those things.

For those interested…

I completed the basic boilerplate for a 1.3 package that pulls in the Prosemirror NPM package and paired it with a very basic demo. It’s just instantiating the editor on the client side with no server code or collaboration yet.

It’s at the state where the design/architecture of the server side and client to server connection needs to be hammered out.

I am just a HW engineer with no professional software development experience so I am not quite qualified to be the lead on that effort. I would be ecstatic if some people were willing to help architect and generate a backlog of tasks of which I could grind away on.

I’m doing a bit of call for help… @mitar, @garilla, @sylvain, @sam if any of you have interest in helping with the project or mentoring a noob let me know!

Bringing this back from the dead…

@funkyeah and I have been doing work on the ProseMeteor project recently, the proof of concept was just finished. Add a few lines of code to your project and you’ve got a fully functioning collaborative text editor, all over DDP!

If anyone wants to try it out, contribue, or has features that they’d like to see implemented, stop on by our GitHub. We’re early in the design phase so if there’s a feature you’d really want, now is the time to start the conversation.

4 Likes

This is so awesome. Thanks to you both for your fantastic work!