Quill: What will I miss if I use innerHTML instead of deltas?

[musaffa]

I'm trying to use Quill in an Ember project. So far I've been successful.

Although Delta is the preferred document format for Quill, I don't want to rely on a non-standard format. So I extract quill.root.innerHTML and save the HTML to the database. When I need to display the content, I put the content under a div with ql-editor class so as to get the proper format added during the editing.

My question is what will I miss if choose to use HTML instead of Delta? Even if I use the HTML way, is it still beneficial to use Quill over other WYSIWYG editors like TinyMCE, Ckeditor?

Hoping for an informative answer. Thanks.

[btbjosh]

I also need to save the HTML "as is" to the database and use it this way. Was bummed to see the api doesn't really "support" this behavior without doing what musaffa mentioned above.

[jhchen]

You are probably safe saving the exact html Quill's editor produces and restoring it before initialization. Crossing between applications is where you get into trouble since there's no such thing as standard HTML for rich text. Quill, Google Docs, TinyMCE, CKEditor all produce and recognize different HTML for the same text and formatting. All do a best effort attempt to recognize different formats from other applications and none are perfect. So by storing and restoring HTML, you are counting on this best effort approach, rather than a precise specification like Deltas.

There is a lot more to Quill other than Deltas. You can see a comparison here.

[cjaoude]

My take on it...

...is to save both the Delta and the innerHTML. When the user is in an edit view, hydrate the editor with the Delta. When the user saves, the Delta is saved but also the innerHTML is saved in its own separate Db field. The HTML is used only in the show content views.

This gets rid of the need to use Quill in readOnly mode in a show view.

Seems like the best way.

[fran-worley]

Another benefit to @cjaoude approach is that if at some point you change your css (e.g. upgrade from bootstrap 3 to 4) you can reprocess the delta into your new css framework rather than hacking up the html!