54

I am looking for a tool or a way to minify (similar to Compress my code and this question on Stack) all of the code in my .xml, .css, .html and .js files through Ubuntu's terminal. Eventually I will bash script the process, but at the moment I would like to just find something to test. Is there a tool out there that I can use to compress all these file formats through the terminal?

Improve this question
3
  • 2
    Have you tried something like tar -czvf compressed.tar.gz *.xml *.css *.html *.php ?
    – roadmr
    Jul 17, 2013 at 14:52
  • 2
    I am looking to compress the code itself. Something like CSS Minify
    – user9447
    Jul 17, 2013 at 15:10
  • 1
    Then I think you're not asking for compression. By compression on regular files (non-media like music/videos) we mostly only consider lossless compression, but you're looking for a way to minimize the whitespace (in which you lose this data). And because minifying is lossy, you can't decompress (because it's not reversible). To me this makes it "unclear what you're asking".
    – gertvdijk
    Jul 17, 2013 at 15:31

9 Answers 9

Reset to default
53

This is not the best option but it's probably the easiest. The YUI compressor was long thought to be the best compressor for Javascript and CSS, offering 20-40% improvements over other minifiers.

It has since been superseded by newer projects like Uglify.JS (which Grunt will probably suggest) but it's still a fairly easy thing to get up and running in Ubuntu.

sudo apt-get install yui-compressor

That's it. Now you can run yui-compressor myfile.js and it'll do its magic, just not as well, or as conveniently as a properly install Node/Grunt/Uglify+YUI stack.

Improve this answer
14
  • 19
    Not everyone who uses js or css is using node.js or doing node.js projects. It is yet another framework to learn and configure if you want to use grunt. Yes grunt is cool. But now-a-days, we already have enough to learn before we can even start coding. So node/grunt is not always convenient. :) I myself am going to try your suggestion of yui-compressor.
    – Bill Rosmus
    Sep 28, 2014 at 7:06
  • 2
    @BillR I sort of agree with the sentiment but while I don't have any node.js projects, I still use things like lessc and uglify.js because they are the best tools for the job. I don't use Grunt because I've replaced it with my own tooling but for the actual work, I'd never hobble myself just to avoid Node. If you want to stay in the industry, you have to keep up with best practices.
    – Oli ♦
    Jan 20, 2015 at 9:53
  • 1
    My point is if what you know works, then you use what's easiest with what you know. Chasing change for change's sake has no value. There's been too many silver bullets. New languages break out faster than a social disease in a whore house. Sure, many flock to them because they are new, but that is a fool's game. I can and will learn new things if there is a benefit to do so. If learning node.js were to help me, I'd learn it. It's just another language. But to learn it, I need to reallocate time to it. My time is valuable to me, and so far I haven't seen the justification in terms of that cost.
    – Bill Rosmus
    Jan 20, 2015 at 21:19
  • 2
    You've got five years on me but I don't know what your point is... Are you still using static HTML4 with a bit of "DHTML" and perl CGI scripts? Still using ASP? Or have you switched things up as better technologies have made themselves available? We've got two separate points going on in this; it's getting a little silly. I don't care if you don't like retraining, but I do care that you're making out that using the more-css NPM package to minify your CSS is any more intrusive than using yui-compressor. It isn't. It's just another command that does the same thing better.
    – Oli ♦
    Jan 20, 2015 at 21:41
  • 1
    Note that with this install you're going to install also the openjkd, a thing that someone wouldn't want in the system.
    – reallynice
    Oct 6, 2017 at 12:58
21

You can minify js easily with node and uglify-js from command line:

  • install uglify-js with npm install uglify-js -g

  • run it uglifyjs app-test.js > app-test.min.js

For css I would suggest clean-css (probably the most stable css minifier on npm). It requires cli package

example usage:

cleancss -o public-min.css public.css

As far as html is concerned usually minification is not usually worth the time you invest in setting it up, but I have tried html-minifier and it's an awesome tool.

Whatever you do just be sure that you gzip what you're serving.

Edit 05-03-2020

Nowadays, instead of using uglify-js, js developers usually use terser.

Improve this answer
6
  • 2
    uglify can be directly installed with sudo apt-get install node-uglify
    – Gery
    Dec 1, 2016 at 17:02
  • Note that uglify-js is only for Javascript, and not for css or other files.
    – Jose Gómez
    Dec 1, 2016 at 20:36
  • 2
    @Gery if you want to install uglify with apt you also need to install node-legacy, so run sudo apt install node-uglify node-legacy
    – mxdsp
    Mar 20, 2017 at 10:03
  • 1
    Note that the cleancss CLI tool is now in the clean-css-cli package.
    – jbg
    May 14, 2019 at 15:30
  • uglifyjs src/lib.js --output dist/lib.min.js --compress --mangle Is better IMHO.
    – totymedli
    Feb 26, 2020 at 22:56
17

Use minify - unlike the other suggestions, this tool minifies a lot more file types:

CSS     text/css
HTM     text/html
HTML    text/html
JS      text/javascript
JSON    application/json
SVG     image/svg+xml
XML     text/xml
Improve this answer
2
  • 1
    It does a very poor job with javascript.
    – Federico
    Nov 11, 2019 at 15:41
  • 1
    Which makes sense, minifying Javascript is very hard, especially if you want to minify it to a large degree. Multiple dedicated projects for JS exist. I'd recommend those for JS.
    – rhbvkleef
    Feb 6, 2020 at 18:55
4

JavaScript Minifier is a Online JavaScript Minifier project by Andrew Chilton. Free, decent and no installation needed

curl -X POST -s --data-urlencode '[email protected]' https://javascript-minifier.com/raw > my.min.js
Improve this answer
2

There is no reason to minify php files (except you have very limited disk space and want to use every bit of it).

If you could add a goal (What do you want to accomplish and why?), somebody might show you a better way.

JS and CSS files are minified on runtime and cached in most webprojects. There is minify (https://github.com/mrclay/minify), a php "library" which is able to do exactly this. (can also be executed with php from the terminal)

But keep in mind that one big javascript file does not necessary load faster than 5 small files. If you need a reason and a solution for this statement, take a look at http://headjs.com/

May the source be with you...

Improve this answer
2

I have had good results with Closure Compiler.

The Closure Compiler is a tool for making JavaScript download and run faster. Instead of compiling from a source language to machine code, it compiles from JavaScript to better JavaScript. It parses your JavaScript, analyzes it, removes dead code and rewrites and minimizes what's left. It also checks syntax, variable references, and types, and warns about common JavaScript pitfalls.

It’s developed by Google and written in Java. It’s packaged for Debian-based systems as closure-compiler and is easily installed on Ubuntu systems. As it doesn’t use a GUI, it requires the more lightweight default-jre-headless package.

It’s slower that YUI compressor but the resulting filesize is (slightly) smaller. It also prints useful warning messages, similar to compilers for other programming languages.

Documentation: Getting started

Usage: 

closure-compiler --js input.js --js_output_file output.js
Improve this answer
2
  • The closure is really good if you start your project with it and extend your objects in separate files, etc. But for an existing project, it's rather terrible.
    – Alexis Wilke
    Sep 10, 2017 at 7:22
  • 1
    I am using Closure Compiler for JS on an existing project as well as Closure Stylesheets for css minification. Both are working very well. Thanks, @anthony
    – tylerlindell
    Jun 19, 2020 at 6:25
1

I would recommend using Grunt.js. It's an automation tool that has minifiers available as plugins and can be run in your terminal via Node.js. It should not be necessary to minify PHP as the code executes on the server side and only its HTML output is sent to the client.

You can find available plugins here

Improve this answer
1
  • 2
    Be aware that choosing Grunt implies a learning curve.
    – Rick-777
    Jan 4, 2015 at 18:04
1

Another option is to use npx command from Node.js. npx runs a command of a Node.js package without installing it explicitly.

# Minify JS
npx -p uglify-js uglifyjs -o app.min.js app.js common.js

# Minify CSS
npx clean-css-cli -o style.min.css css/bootstrap.css style.css

# Minify HTML
npx html-minifier index-2.html -o index.html --remove-comments --collapse-whitespace

# XML
npx pretty-data-cli --type xml --minify input.xml > input.min.xml
Improve this answer
0

I found this java library for HTML (you need to have java installed): https://code.google.com/archive/p/htmlcompressor/

Command line usage is simple:

java -jar htmlcompressor.jar inputfile.html > outputfile.html

And for CSS I use this (better compression rates than other tools that I've tried): https://github.com/acwtools/accss

Command line usage:

accss inputfile.css > outputfile.css
Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .