This plugin will GZIP and JSMIN your JavaScript files as well as allowing the ability to put JavaScript files into a single file at the client's end. Cache expiry time can also be set in the admin page.

Now in version 2.0 you can add JavaScript files to a specific page or post and putting all of them into one file.

Download WP JS

Version 2.0

Description

This plugin will GZIP and JSMIN your JavaScript files as well as allowing the ability to put JavaScript files into a single file at the client's end. Cache expiry time is can also be set in the admin page.

Installation

  1. Upload /wp-js/ folder to the /wp-content/plugins/ directory
  2. Activate the plugin through the 'Plugins' menu in WordPress
  3. Set the permissions to 777 for the /cache/ folder
  4. Go to Settings > WP JS in the admin site. This setup the plugin.
  5. Use <?php wp_js('path/to/js/file.js'); ?> to compress a JavaScript file.

How it works

This plugin makes JavaScript implementation easier in wordpress by allowing developers to combine JavaScript files together as well as compressing them.

Let's say we have the famous prototype and script.aculo.us JavaScript libraries. This is in total of 8 files and 247KB files size. Lets say we GZIP each file separately this turns the total into 63KB (74% decrease), which is a good decrease in size. However the user would still have to download 8 files. WP JS turns the files into a mere 45KB (82% decrease) download for the user. This plugin allows you push JavaScript development in terms of modularization and download sizes for Wordpress.

Prototype & Script.aculo.us libraries. Compression test

Tests were measured using a Firefox plugin called Firebug. Firefox was run a Mac Pro (2008) using OS X 10.5.3. Eight files were include in this test: builder.js, controls.js, dragdrop.js, effects.js, prototype.js, scriptaculous.js, slider.js and sound.js – all taken from the script.aculo.us website.

Adding JavaScript files to specific page/post

The plugin new feature scans through your current theme for any JavaScript files. It will display the files in directory order. Its very simple to use and allows you to combine all JavaScript files added into a single file.

Screenshot of Wordpress Admin site - Adding JS File

Examples

Using wp_js()

The default behaviour is to specify one file for WP JS to compress and GZIP.

<script src="<?php wp_js('/javascript/global.js') ?>" type="text/javascript" charset="utf-8"></script>

Textmate screenshot header.php file using wp_js()

Using wp_js() with several files

However it is also possible to combine several files together. It is very easy and only requires that you comma separate files inside the string parameter.

<script src="<?php wp_js('/javascript/sifr-addons.js,/javascript/sifr.js') ?>" type="text/javascript" charset="utf-8"></script>

Textmate screenshot header.php file using wp_js() with several files

Admin section

The admin section will allow you:

Screen of WP JS admin page