Search code examples
canvaseditorwysiwyg

Cutting edge online WYSIWYG editor wanted


What is the most efficient WYSIWYG editor that can be used on a blog?

I'm looking for something like the one in Gmail, but I'm really annoyed that sometimes the cursor gets stuck in some invisible wrapper div tag or after selecting and deleting a part of text the cursor jumps to the end of the whole block.

The ideal editor doesn't have to be backwards compatible and may use emerging technologies. I don't have anything specific in my mind but I've heard about the Bespin project and wondered maybe the canvas tag could be of use. Or perhaps Silverlight or Flash, I don't know.

I'd use this editor to create and maintain fairly simple HTML document structures with hyperlinks, images, headers and lists. The ability to assign CSS classnames to nodes would be a plus. Speed and responsiveness is also a major factor.

Clarification:

I'd love to see an editor which doesn't rely on contentEditable, since as Pekka has mentioned that is the source of the annoyances.


Solution

  • Doing a HTML editor using something like Canvas would be far more complex than Bespin. In Bespin the text is always using the same font, there are no html or css rules to respect, it's just text that you can know beforehand how it should be rendered. And you have to keep in mind that doing something like Bespin isn't easy.

    In HTML there are images, tables, lists, different font-sizes, floating elements... so doing all the rendering using Canvas would be a huge initial task, and after that you have to add the editing features to select the text, images, ...

    Flash does support a limited set of HTML, it's really poor in that aspect so you can't expect a good HTML editor based on that.

    With regards to Silverlight, I don't know its current state, but at the very first moment that they release something "usable", you can expect several such editors to popup like there are hundreds of little js editors that just use contentEditable.

    The difference between all the js editors that claim to be fast, small or simple and the most widely used like CKEditor and TinyMCE, is that these ones work hard to fix the problems due to each browser and that's why they aren't so small, but on the other hand you have much better control of the output and the behavior while editing. In that aspect these editors are implementing lots of the features by themselves, contentEditable might be used to provide the basic keyboard functionality, but each day more features are implemented in js instead of relying on the native behavior of contentEditable.