Friday, August 29th, 2008
TinyMCE WYSIWYG editor broke apart as I separated static media files to different domain name. I fixed this. I think I can fix anything hypertext now, although it made me write this article.
Separating static files such as JavaScript, CSS and images to different server is a recommended step to improve performance of a website. The workaround was to use reverse-proxy to backend server leaving static files handling to Nginx front-end server, instead of using separate domain for static files. This left everything nicely on the same domain name.
TinyMCE and similar JavaScript WYSYWIG editors suck for the following reasons:
TinyMCE is still one of the best options on this niche market, even if it allows users to shoot themselves in the foot with HTML non-data tables. Unfortunately every client requires to be able to do this.
WYSIWYG should be a browser independent extension users can use for any text-area that allows HTML input.
There is still hope. WYM works well for me. It needed a bit of work to improve the iconset, skin and CSS, but it is a great piece of JQuery.
Let's do business. Skype "vizualbod" or e-mail to vizualbod@vizualbod.com.
Stumbled on your blog. I’m the author of TinyMCE and just want to comment on the 3 issues you have there.
1. Use the gzip compressor package that we provide and the number of files and over all download size will be way smaller. From like 70 request down to 4.
2. TinyMCE can be loaded from a different domain but they need to be at the same root domain due to the browsers same origin policy. So TinyMCE can be loaded into a.site.com from b.site.com but not from b.othersite.com. This is a browser security feature we can’t build around in a easy way.
3. Same here only IE has the ability to return the HTML contents of the clipboard before it’s inserted into the editor. Most other browsers doesn’t have any onpaste support so our hand are ones again tied.
So to sum it up why all rich text editors suck is due to browser limitations and other issues.
I completely agree with the article, most rich text editors out there suck and I have yet to stumble upon a good one. I also have an additional pair of problems with the common editors:
1. They’re do not return semantic markup, the returned markup is often completely flooded with style attributes (of course depending on the content).
2. They usually don’t live up to their acronym. What you see isn’t actually what you get since while editing, for example, strong-tags are usually represented by b-tags or spans with style attributes, which is bad if your destination for the markup is a place where strong-tags are styled differently and you want to see that while editing.
I’m actually working on an editor which will solve all of the problems mentioned here and in the article (even the pasting of ugly markup). You will even be able to attach your own style sheets to the editor, and see the result directly while editing. It will also actually be lightweight–not TinyMCE lightweight, but really lightweight–with a size ~80 kilobytes.
So to sum it up it’s the Wysiwygs’ developers own fault the editors suck, and not due to browser limitations impossible to overcome. :P
@ Spocke: for the third point, I believe WYM cleans markup before you submit the form by launching the cleaning process as you press submit button. You don’t have to clean things onPaste, you can clean it before it gets submitted. Many people do it with Tidy on the server before it gets to the database, although having the editor to do it is very convenient.