ProseMirror document model | Hacker News Reader

ProseMirror document model

prosemirror.net

44 pointsbpierre5 comments

It's hard to understate the importance of ProseMirror. Any dev who has created web apps that embed contentEditable -- and supported such projects -- will know how important this is.

The problems with contentEditable are well-known. There is no real spec. There is a long list of bugs in all browsers, including Chrome and Firefox. There are many incompatibilities between the browsers. Granted, there are some hacks that help get contentEditable mostly working, but it's still a mess.

But contentEditable is fundamentally the wrong solution to the problem of rich-text editing. People copy and paste all manner of garbage into it (sometimes unintentionally). We've written routines that strip out the kinds of html that Microsoft Word produces, but it's still hard to keep the document relatively clean of font-sizes and other formatting problems. What we really want is something that specifies the structure of the document without specifying font-sizes or other appearance-specific attributes -- something like Markdown.

GitHub, StackOverflow and other sites have avoided contentEditable entirely, requiring users to edit in Markdown directly. But Markdown is more difficult to sell to non-programmers.

Medium and Google Docs have solved many of these problems, but their editing components are not open-source. ProseMirror is, to the best of my knowledge, the first industrial-grade open-source component to solve the rich text editing problem.

Thanks for summarizing the point of my project better than I've managed!

Unfortunately, it seems that a HN frontpage spot isn't happening for this project. If you know of communities that might be more interested in it, let me know.

Indeed. Contenteditable is awful, especially when collaboration is involved, since different browsers produce different HTML. I wrote a similar rich text editor for the Storify editor when we introduced real time collaboration, about a year ago. We intercept all of the editing events, perform whatever actions are necessary on our internal document format, and then manually sync those changes into the DOM. Our document format is designed in a way that can be synchronized in real time using operational transformation, which is impossible to do with HTML. This is really the only way to build a good rich text editor IMO.

I'm glad Prosemirror was written, since it sounds like it does similar things. Wish it existed a year ago. ;-)

HTML is awesome, but people are still writing with tools from the print era. When are we going to start using the Web for the content we still generate with Office?

ProseMirror can help fix this - by separating content from the HTML you're editing, you'll be able to edit things that live on the Web, without having to understand the complexities of the HTML etc. used for rendering in browsers.

"Why the Web needs better HTML editing components" - http://blog.pubblz.com

I agree completely with your comments about ContentEditable. See https://news.ycombinator.com/item?id=10087162 for my own recent contribution to the rich text editing problem without using ContentEditable.

Reply on news.ycombinator.com