How to compress tinymce and all plugins into a static file?

Question

documentation for tinymce notes that you can compress all javascript and components (which, I assume, includes plugins) into a single file. They notice the reasons why you don’t want it either.

Compression to a static file

It is also possible to simply combine the necessary components and some boilerplate code into a single .js file. However, you will always need to recreate this file if you want to use other TinyMCE plugins or update TinyMCE. You will also probably want to configure your web server to compress javascript files.

But assuming that someone really wanted to do this, how does this actually happen? Build.xml does not provide the corresponding task. At least when I tried, the plugins didn't seem to be included when I downloaded tiny_mce.js.

Answer 1

There are some really excellent command line tools for this, but you can also easily do this with a text editor. The easiest way is to simply open each file, copy the contents and paste the contents into one JS file (for example, "all-all-together.js"). You need to make sure that you insert the files into one file in the same order in which you placed the script tags in the HTML document. After all the files are merged, you can use tools such as JSXMin, YUI Compressor or Google Closure. There are also some online tools that do this, such as http://www.minifyjavascript.com/ . You can paste uncompressed JS and copy back compressed JS. This makes the build process really cumbersome, but if you just need to do it once, it will take you there.

The best way to do this is to do it as a build step for the site. This means that when you make changes to the JS files, you rebuild the compressed JS file to include the changes. This can be a cumbersome step if you repeat and change files over and over again. You do not want to recompile the compressed file each time you save. You can solve this problem by setting up ways to design and produce a site. When loading in development mode, JS files are not grouped. When all the necessary changes are made, you will restart the build step to create a single compressed JS file. To perform minimization from the command line, you probably want to use Google Closure: https://developers.google.com/closure/compiler/ . If you download the compiler application, you can do the following:

java -jar compiler.jar some-file.js some-other-file.js> compiled.js

This will create a file called compiled.js that will contain the contents of some-file.js and some-other-file.js in a mini format. You can specify as many files to compile as you need. In fact, I am selling Closure a little shorter to say that it is just mined. It is also extremely optimized code. Almost every site should do this with all JSs all the time, if they don’t already do something better.

Answer 2

Hope I get you (and tinymce docs) correctly, but this is very similar to server-side javascript merging. This means that you download the contents of all your JS files, placing them in a single file and returning them to the client.

Why would you do this? Well, that should be obvious, but .. you reduce the number of HTTP requests to your server, which is always good.

How do you do this? There are many solutions for all server languages ​​and frameworks, I suggest doing a Google search for "[your language] javascript minifier" or something similar.

Hope this helps.