Combining and Compressing Multiple JavaScript Files in PHP

Combining and Compressing multiple JavaScript files in php

You can use jsmin-php

Their sample code is:

require 'jsmin-1.1.1.php';

// Output a minified version of example.js.
echo JSMin::minify(file_get_contents('example.js'));

You may easily join several js files by doing something like:

require 'jsmin-1.1.1.php';

// Output a minified version of example.js.
echo JSMin::minify(file_get_contents('example.js') . file_get_contents('example2.js'));

Combine and Minify Multiple CSS / JS Files

I ended up using CodeKit to concatenate my CSS and JS files. The feature that I find really useful is the ability to do the concatenation upon file save; because it monitors the respective CSS / JS assets. Once I got them properly combined e.g. to 1 CSS and 1 JS files, all other files simply can refer to these 2.

You can even ask CodeKit to do on-the-fly minification / compression.

Disclaimer: I am not affiliated in any way with CodeKit. I randomly found it on the web and it has served as a great tool in my development process. It also comes with good updates since I first used it more than a year ago.

Compression and mergin of JS files with PHP- Text editor

I suppose that the problem is the statement include("$value.js");echo "\n";
This way, if the included javascript file contains at least a "<?" string, and if you have enabled the "short_open_tag" option in your "php.ini" configuration file, part of the javascript code is being parsed from the PHP interpreter as if it was PHP code, probably throwing a syntax error and therefore ignoring the subsequent includes.

Looking at the "prettify.js" source code I've seen that effectively is present the "<?" string at line 471.
Maybe changing the line include("$value.js");echo "\n"; to readfile("$value.js");echo "\n"; should solve the problem.

Combine multiple JavaScript files into one JS file

On linux you can use simple shell script https://github.com/dfsq/compressJS.sh to combine multiple javascript files into the single one. It makes use of the Closure Compiler online service so the resulting script is also effectively compressed.

$ ./compressJS.sh some-script.js another-sctipt.js onemore.js

Tool to combine multiple javascript files into one...

For PHP, try Minify: http://code.google.com/p/minify/

From the docs:

Minify is a PHP5 app that helps you
follow several of Yahoo!'s Rules for
High Performance Web Sites.

It combines multiple CSS or Javascript
files, removes unnecessary whitespace
and comments, and serves them with
gzip encoding and optimal client-side
cache headers.

Combining and Compressing multiple JavaScript files into a single file in a Django project

I am an happy user of django compressor, it does combine, minify, debug-friendly, you can use it with staticfiles, easy to plug with custom storage backend (eg. S3)

https://github.com/jezdez/django_compressor

Easiest way to pack/minify multiple javascript files?

Closure compiler (and I suspect most of the big JS compressors) already allow for this.

From java -jar closurecompiler.jar --help

--js VAL

: The javascript filename. You may
specify multiple

Multiple javascript/css files: best practices?

I would suggest using PHP Minify, which lets you create a single HTTP request for a group of JS or CSS files. Minify also handles GZipping, Compression, and HTTP Headers for client side caching.

Edit: Minify will also allow you to setup the request so that for different pages you can include different files. For example a core set of JS files along with custom JS code on certain pages or just the core JS files on other pages.

While in development include all the files as you normally would and then when you get closer to switching to production run minify and join all the CSS and JS files into a single HTTP request. It's really easy to setup and get working with.

Also yes, CSS files should be set in the head, and JS files served at the bottom, since JS files can write to your page and can cause massive time-out issues.

Here's how you should include your JS files:

</div> <!-- Closing Footer Div -->
<script type="application/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.min.js"></script>
</body>
</html>

Edit: You can also use Cuzillion to see how your page should be set up.

Combining files to have only a single call for all CSS files with Assetic on Symfony 2

Like describe in the documentation, you can also combine several files into one. This helps to reduce the number of HTTP requests, which is great for front end performance.

You just have to use this syntax :

{% javascripts
    '@AcmeFooBundle/Resources/public/js/*'
    '@AcmeBarBundle/Resources/public/js/form.js'
    '@AcmeBarBundle/Resources/public/js/calendar.js'
%}
<script src="{{ asset_url }}"></script>
{% endjavascripts %}

---

Related Topics