We have a client that needed one big form with many WYSIWYG editors – at least six to be exact. Unfortunately we couldn’t change his mind about modifying form layout so less WYSIWYG editors would be used. So we’ve decided to test TinyMCE vs CKEditor – which one is faster and more resource usage efficient. We’ve created plain website with 6 forms and than compared results using developer tools with Firefox and Chromium. Here’s what we found out..
Our test was focused at basic WYSIWYG functionality without additional plugins. Only speed and resource usage was taken into consideration. There was no editors tuning whatsoever – just minified JS scripts directly from it’s producer.
Tested environment is: Linux Ubuntu 16.04.2 LTS 64 bits.
Firefox ver 53.0 64bits
vs
Chromium 57.0.2987.98 64 bits.
Chromium without additional plugins, Firefox only with flashplayer plugin so browsers should work as fast freshly installed software.
For both editors was used with jQuery v1.11.2.
TinyMCE version 4.5.6 (2017-03-30)
CKEditor version 4.6.2 revision 20af917 (2017-01-12)
During this brief test we could feel the difference that CKEditor maybe faster. Number of HTTP requests made by CKEditor is significantly smaller than TinyMCE:
Load time confirms that CKEditor is also much faster than TinyMCE:
But it also shows that Chrome/Chromium is handling WYSIWYG editors better.
Conclusions
CKEditor seems to be faster than TinyMCE and basically Chromium seems to be faster than Firefox in WYSIWYG editors. But keep in mind that this is very brief test – we didn’t test it under other platforms like Windows for example. Also we didn’t check how these editors would behave with different jQuery versions – probably there’s place for improvement as well. Another thing to bear in mind is that tests were made with clean browsers – without any plugins. So if your browser is full of additional plugins expect to get much slower results.
If you have any suggestions about this test please share a comment.
Here are raw screen shots of developer tools:
