JavaScript compressor issue
Case in point: when we attempt to include react-plotly.js (which spits out huge output files!), and try and compress the JavaScript with compressor.filters.jsmin.JSMinFilter and compressor.filters.jsmin.CalmjsFilter, compression fails. When we remove compressor.filters.jsmin.CalmjsFilter, it compiles (allegedly having compressed things down), but does not work in the browser. The compression is not working correctly in some instances.
So is there a configuration issue with the compressor, or do we just need to find a new compressor?
Look for COMPRESS_JS_FILTERS in worker/worker/settings/base.py.
So it seems like the django-compressor code is messing everything up. There's a problem in there with larger modules (over 2-3MB in size), and it seems to spit out incorrect code when we try apply a filter to minify it.
The solution seems to be to completely skip the django-compressor COMPRESS_JS_FILTERS filters, and just minify it using the minify command.
- Ensure that
minifyis globally installed. Do this withnpm install minify -g. We can addminifyto line 29 of theDockerfilefor the worker. - Remove all
COMPRESS_JS_FILTERSfrom thebase.pysettings module for the worker. - Alter the
COMPRESS_PRECOMPILERSsetting. Change themoduletuple to the following.
('module', 'browserify {infile} -t babelify | minify --js > {outfile}'),
This should then mean that instead of passing the compression job to django-compressor, we do it directly by piping the output of babelify straight to minify, which then saves its output to the specified output file.
That should work! Tested on the fork by @hjpvandijk for his project. The 9MB JS file was reduced to 4MB. And it works fine in the browser. So I am pretty happy that this solution seems to work, unless we can find a further issue with it.