What is the best way to minify javascript, jQuery and CSS files - javascript

What is the best way to compress or minify jQuery, javascript and CSS files?
I am new with the compressions and minify features of web development please help me.

I personally use Yahoo Compressor and would recommend it. Why? Because it works.
An example of how to execute it at the command line:
java -jar yuicompressor-2.4.7.jar javascriptfile.js -o outputfile.js --charset utf-8
Do the same on a CSS file:
java -jar yuicompressor-2.4.7.jar style.css -o outputstyle.css --charset utf-8
Actually, I just realized I use a thing called htmlcompressor for HTML files:
java -jar htmlcompressor-1.5.3.jar hmlfile.html --remove-intertag-spaces --compress-js
Google's Closure Compiler looks good as well, but I have not personally used it yet so I'm not sure if it does CSS and HTML as well as Javascript.

I recommend using a tool which is provided or can integrate with your framework/toolset, to handle this automatically.
If you are using django, I recommend spaceless template tag or django-htmlmin app for html templates and django_compressor for js/css.

You can try http://www.jasob.com/ it allow you to Obfuscation and compression for JS and CSS

You can use require.js optimizer within node.js or Java, which supports both optimize the code itself and also minimize it [ If you are using require.js ]
You can use Google Web Toolkit restful api to increase performance of your codes and also for minifying purposes
You can use ASP.NET bundling for minifying
You can use Grunt to automate you unit tests and minifying

Related

How to obfuscate or minify Javascript files

I'm doing a web based java application using Netbeans IDE, There are some javascript files in netbeans IDE. I need to Obfuscate or minify my javascript files automatically when I clean and build the project, Is there any solution for that? or do I need to write any build script , please provide me a solution
You can use gulp. Gulp has a great gulp-uglify plugin for that(https://www.npmjs.com/package/gulp-uglify).
If it's a simple website and you don't want to use advanced solutions like task runner (Gulp) you can simply use website like this one - https://jscompress.com/ - and minify your all files after your page is done.

installing Closure Compiler on debian Nginx

I was searching over the internet to find a good document about how to install Closure Compiler from google on my Debian Nginx server, and got nothing. all I got so far is Closure Compiler. I want to install this tool to compress and minify both css and js files independently so that these static files get lighter on page load when requested.
Is there any good source how to do that?
all I find is about Yui compressor which is not as good as Closure Compiler as I read.
any thoughts on that?
Closure Compiler does not minify CSS files, just JS files. For that you want: https://github.com/google/closure-stylesheets
Closure Compiler isn't a good choice if you want to minify arbitrary JS files without testing the result. It doesn't back off when faced with eval or with or IE's conditional code like some other compression tools do.
If you are using Apache perhaps you might like Google's PageSpeed module which is designed to work in the general case.

Problems with Dojo ShrinkSafe

I'm trying to minify a JavaScript file using the online Dojo Shrinksafe service, but it's giving me an empty file.
What's going on?
ShrinkSafe is deprecated. Use the online Closure Compiler or UglifyJS instead if you need to minify code online.

How to organize and minify lots of javascript files?

I have a project written on PHP and JavaScript.
For example, I have two main JavaScript files
main1.js and main2.js.
They use the same functions, and I want to extract the functions to lib.js etc.
On develop environment it's more useful to use 3 different files, but on production i'd like to have 2 minifyied files with lib.js included.
I want to see changes on dev immediately without any preprocessing, and I want to use some preprocessing on production.
For example I can write a javascript function require(filename) that loads needed js file, but how to tell minifyer to include the file inline on production?
You should look into YUI Compressor
and also into creating makefiles
you can also compress CSS with YUI Compressor
If you are using netbeans then you can use the plugin from here
Plugin
Also you can use
minifycss
YUI
For online compression
Coffee Script is used for caching the js files on browser side. It create a single js file from all files, and minify the resultant code.
you can try these for minify javascript and css online.
http://minify.avivo.si/#results
http://gtmetrix.com/minify-javascript-and-css.html
http://www.minifycss.com/

Is there a javascript/css compressor plugin for visual studio?

I'm looking for a visual studio plugin with the following functionality:
On building the project or executing the tool, the plugin looks for all *.js and *.css files in your project and compresses/minimizes them into *.min.js and *.min.css files.
Executing the tool on project build would enable you to keep the references to *.min.js in your pages while changes to the *.js files would be instantly written to the *.min.js files.
Is there such thing available?
If not what's the closest thing to automize tasks like that?
Extra question:
How about auto combining files?
Check out these two links:
An MS build script for YUI compressor
YUI compressor for VS
You probably be better off doing it with NAnt and coding it to run the compression. Automated process is always better than a manual one.
Web Essentials is best program for that, I really like it, and it has a lot of other nice features: http://vswebessentials.com/

Categories