Skip to content

Instantly share code, notes, and snippets.

@Reinmar
Created October 7, 2013 23:00
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Reinmar/6876464 to your computer and use it in GitHub Desktop.
Save Reinmar/6876464 to your computer and use it in GitHub Desktop.

TL;DR I'm a CKEditor core dev, I watched http://vimeo.com/76219173 in which CKEditor was mentioned, I'm sad now.

Disclaimer: I am a CKEditor core developer since January 2012, so I've been working nearly exclusively with contenteditable for almost two years. That made me an expert in some of fields that WYSIWYG editor deals with and gave me a decent knowledge about the rest. Although, my opinion may be biased.

I watched the video from "contenteditable: Roll for sanity" presentation by Garann Means with great interest. The contenteditable feature is a base for all WYSIWYG editors (except those with completely custom rendering system like Google Docs), but is not popular and most web developers have no idea about such thing (what on the other hand does not surprise me). What's more, those who stumble upon it quite often fall into the standard trap:

Hey, we just met and this is crazy, but we've got few hours so let's create a new WYSIWYG editor maybe!

This approach to web development pretty often results in at least decent solutions, but in this case... in complete mess.

Anyway, it was one of the points of the talk, that working with contenteditable is not as easy as it may look like. What I can say from my experience is that Garann only touched a tip of an iceberg. I would say that it was less than 5% of what a decent WYSIWYG editor has to deal with. (Actually, I wanted to write 1%, but I thought that it might look silly.) Also, note that dropping support for older browsers won't help you.

What struck me though, was Garann's attitude to CKEditor and TinyMCE. I would really like to hear what makes CKEditor so awful, because as far as I saw CKEditor actually fixes all (or most) of the issues with native contenteditable mentioned in the talk (and 90% of those beneath the see level). Don't think that my CKEditor core dev's ego was hurt - I really used to hear such comments (although, they are much less common recently). But in this case, when native contenteditable was shown as a insanely tough opponent, I really don't get the reasoning.

There was, however, one argument I can comment on. TinyMCE was mentioned as not so tiny (and CKEditor isn't so tiny too). But few slides earlier Garann showed a code which (as far as I understood, because the quality of video was poor) just wraps selection with a given element (?). This code is neither trivial, nor short, nor, I assume, complete and battle tested. Now, add a method which removes the style from given range, another one that checks if the style is already applied on the given selection and make all this somehow configurable (so different type of styles can be applied). You'll end up with at least 1kLOC (in fact it's a lot more, because another few thousand are reused from other components) in just this one feature. Now add remaining features and don't be surprised when you reach >40kLOC (there's 38kLOC of JS in the basic CKEditor package) when building a basic editor with just bold, italic, lists, links, fixed enter key, pasting, undo/redo and other fundamental functions.

To sum up - if you want to create your own, simple, jQuery based WYSIWYG editor, make sure you have a sufficient supply of antidepressants and patient boss.

Piotrek Koszulinski, @reinmarpl

@Reinmar
Copy link
Author

Reinmar commented May 7, 2014

Wow... I've just accidentally stumbled upon this gist and noticed that you replied. I thought that Github will notify me about that. Apologizes for the 7 months delay :|

Anyway, thanks to both of you for replying. There's very little discussion about contenteditable and editors, so every high quality feedback is really valuable. Editor is usually the last component of a CMS or other kind of system, installed in a hurry, without any understanding of the problem. That, combined with a complexity of the topic and insufficient documentation, leads to frustration. There's no easy solution for this situation and I think that it may only be improved by evangelising developer (every presentation about contenteditable, like yours Garann, helps!) and improving editors (including architecture which you mentioned) and their documentation. That's a long road though, but we're motivated to take it anyway :).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment