Improve TinyMCE performance in Angular app

Question

I've set up tinyMCE in my angular application by using the latest (4.x) version of tinyMCe and the latest version of angular-ui/ui-tinymce (https://github.com/angular-ui/ui-tinymce). All of the code is minified.

In my application I have multiple instances of tinyMCE on a page (up to three) and the application uses the angular routing mechanism.

Everything is set up correctly, the editors work (and each of them has their own configuration).

The problem I'm facing now is performance. Whenever I load a new page the tinyMCE instances recreate themselves even if they are already there (= in the dom)! Creating a tinyMCE editor takes some time (up to 3 seconds) The amount of text in it doesn't seem to matter much.

I've tried using tinyMCE's gzip compressor but I couldn't get it to work.

What actions can I take to improve the performance in my application?

If at all relevant: I'm using a Java backend and AngularJs version 1.2.16

Answer 1

How-to optimize initialization speed of TinyMCE

(Wanna see original article?)

Here are some actions to take to boost initialization/loading time of TinyMCE.

• Use and install the TinyMCE Compressor.
  This will bundle all JavaScript HTTP requests into one big request and also gzip compress them by 75%.

• Enable the button_tile_map option (should be enabled by default).
  This makes the icons load faster since multiple image requests are replaced with a few tilemap requests.

• Compress other scripts using the custom scripts option inside the compressor.
  There might be other third party scripts on the same page. These can be added to the compressor as well.

• Disable plugins that you don't need.
  Remember to both remove them from the tinyMCE.init and the tinyMCE_GZ.init calls.

There is currently no compressor for TinyMCE 4 for Java backend, unfortunatelly. And as you've already said, all of the code is minified. So the only thing I can advice: remove unused plugins and reduce a number of requests by concatenating multiple JS files into as few files as possible.