Monthly Archive for December, 2008

Blog Optimization – Getting Started with Mod Concat

Published on December 27, 2008 in *nix, Blog Optimization, JavaScript and Servers & Hosting. Comments

Following my post on Blog Bloat, I have finally gotten around to installing mod_concat. I asked my hosting provider ServInt to handle the upgrade to Apache 2.2.x, they did it in about 20 mins – thanks guys, you rock!

The actual installation of mod_concat was fairly simple thanks to the included instructions, though it lacked a few of the finer points, like needing to install the module into the Apache modules directory and modifying httpd.conf to include mod_concat, this is easily handled by adding the -i and -a flag. First grab the project out of SVN, then you can compile it.

prompt:$ svn checkout http://modconcat.googlecode.com/svn/trunk/ modconcat-read-only
prompt:$ cd modconcat-read-only/mod_concat
prompt:$ apxs -i -a -c mod_concat.c 
#Make sure the config file is working okay
prompt:$ apachectl configtest
#Then it's safe to restart and use the concat module
prompt:$ apachectl -k graceful

That’s all it takes to get the module working with Apache 2.2.x. I setup a super simple test here to ensure mod_concat is working.

Optimizing WordPress K2 using mod_concat

Getting this Apache module working with WordPress and K2 wasn’t quite as simple as I was hoping. I ended up having to do more customization work than I desired. The issue with K2 is that many of the included JavaScript files, for handling the rolling archives and live search, have a .php extension that includes a gzip directive header. Additionally, the K2 files are nested so deep that mod_concat can’t handle it.

To deal with these short comings, I sourced the K2 JavaScript files and moved them to a root directory. Currently, the files to be concatenated are hard coded into the plugin. Perhaps a future revision will resolve this, however, I am more interested in testing out mod_jsmin and mod_deflate before I get around to this enhancement.

Here is the plugin code I wrote in order to use mod_concat with K2.

<?php
/*
Plugin Name: WP Mod Concat
Description: This plugin leverage the Apache 2.2.x module mod_concat to combine a list of files into a single file
Version: 0.1
Author: Gregory Tomlinson
Author URI: http://gregorytomlinson.com/encoded/
*/
 
remove_action('wp_head', 'wp_print_scripts');
add_action( 'wp_head', 'wp_mod_concat_optimzie' );
 
function wp_mod_concat_optimzie(  $handles = false  ) {
        $base_url = "http://gregorytomlinson.com/js/??";
        $script_files = array("jquery_1_2_6.js", "k2.functions.js", "k2.livesearch.js",  "k2.rollingarchives.js",  "k2.slider.js", "k2.trimmer.js", "swfobject.js" );
 
        echo '<script type="text/javascript" src="'. $base_url . join(",", $script_files) .  '"></script>';
}
?>

By using remove_action(’wp_head’, ‘wp_print_scripts’);, I can stop WordPress from loading JavaScript files. I then replace the head script files with the concatenated version leveraging mod_concat, which produces a script tag that looks like the following.

<script type="text/javascript" src="http://gregorytomlinson.com/js/??jquery_1_2_6.js,k2.functions.js,k2.livesearch.js,k2.rollingarchives.js,k2.slider.js,k2.trimmer.js,swfobject.js"></script>

You can learn more about mod_concat here.

The other drawback to mod_concat is it’s incapable of handling query parameters. I would like to be able to append a ?ver=1.1 in order to handle busting the browser cache, but the current version isn’t able to do this, maybe Ian can fix this :)

That’s all it takes to use mod_concat. It’s probably not the ideal method to use with WordPress and K2, you may consider using PHP Speedy. Dave Artz runs down a list of other concatenation methods in this blog post.

Installing SVN on Red Hat Enterprise Linux AS release 4

Published on December 26, 2008 in *nix, General and SVN. Comments

This couldn’t be easier, all I did was run the following, once I figured out what flavor of Red Hat the IT team had installed on my machine.

prompt:$ rpm -i http://the.earth.li/pub/subversion/summersoft.fay.ar.us/pub/subversion/latest/rhel-4/bin/subversion-1.3.2-1.rhel4.i386.rpm

You can find SVN for your operating system here. Many thanks to Wijaya for helping me quickly determine my flavor of Red Hat in the blog post here.

My 10 Favorite WordPress 2.7 Plugins

Published on December 26, 2008 in General and Projects. Comments

WordPress is pretty great out-of-the-box, but sometimes you just need a little more. This is a quick list of my 10 favorite WordPress 2.7 plugins. I have used all of these and I can’t live without most of them.

  • WP-Cache – A nice little caching plugin, avoid outages from the ‘Digg effect’ a.k.a. the Slashdot effect.
  • WPtouch iPhone Theme – A nice little iPhone theme that enhances performance and navigation on the iPhone and iTouch.
  • WP-Syntax – Syntax Highlighting for most popular languages.
  • Ultimate Google Analytics – A plugin that places the Google Analytics code on your blog and removes the code when logged-in users are above a certain level.
  • Disqus Commenting System – Disqus is the hottest new commenting system on the block, its developers and staff are very friendly. Lots of other pluses – check it out.
  • WordPress.com Stats – At a glance statistics. This one isn’t perfect and the Google plugin is much more accurate, I enjoy this mostly because I can see the traffic numbers from inside the WordPress admin screen.
  • FeedBurner FeedSmith – Feedburner rocks! It gives you nice statistics about who is consuming your feed and they have to pay for the bandwidth.
  • Akismet – Spam protection that works, if you aren’t using Disqus, this is a must  (and it comes with WordPress)
  • WP E-commerce – This is a great plugin that allows you to stand up e-commerce on your blog in minutes. It has support for Google Checkout, as well as PayPal and other payment options.
  • Google XML Sitemap – Just like it sounds, creates a sitemap and notifies the major search engines.

Update: My eleventh favorite plugin is ‘Recently on Last.fm’. It shows your recently played items. Check it out, it’s over on the right side of this page.

Have I left anything out? I can think of a few more that are worth considering – tell me what I might have missed

JavaScript Array Merge

Published on December 25, 2008 in General and JavaScript. Comments

For a project, I needed the ability to merge an array from a remote source with an array living in memory in the browser. JavaScript doesn’t have an explicit function that handles this outright, so I cooked up a little prototype that I am sharing today.

The specific issue I was concerned with was the original array could possibly have thousands of items, so I didn’t want to use a for or while loop for this very reason. Also, I wanted to have a single method that handled adding elements at the front of the array, end of the array or replacing any items in the array. Finally, it was important to my project that the original array is not modified.

Let’s start by looking at the final prototype product.

Array.prototype.smoothInsert = function( newArray, start, howMany ) {
	/*
		This code takes an array and replaces a section
		of an array with the values found in the new array
 
		* howMany is optional
	*/
	var al = howMany || newArray.length;
	if( start < this.length )
	{
		var begin = this.slice(0, start);
		var end = this.slice( al+begin.length );
		var combine = begin.concat( newArray ).concat( end );
		return combine;
	}
	else if( start >= this.length )
	{
		var n = start - this.length;
		var a = new Array( n );
		var combine = this.concat(a).concat( newArray );
 
		return combine;
	}
 
	else { return this.concat( newArray );	 }
 
}

Let’s talk about exactly what is happening in the above code. The first argument is the new array you want to add into the existing array. The second is the start position to start adding the new array. This is similar to how JavaScript slice works. The final argument is the end position, or how many items to replace / update with the new array. If this is undefined, the length of the array passed into argument 1 is used.

Now that we have all the variables defined, let’s look at a few examples where this comes in handy.

var remoteArray = ["remote2","remote3", "remote4", "remote5" ];
var inPageArray = ["current1",,,,,"current6", "current7", "current8", "current9", "current10"];
var finalArray = inPageArray.smoothInsert( remoteArray, 1 );
console.log( finalArray ); // ["current1", "remote2", "remote3", "remote4", "remote5", "current6", "current7", "current8", "current9", "current10" ]

The final array (the original is not modified – just like slice), combines the remote array with the in page array, it does this by leveraging slice and concat, two built-in functions. Since slice doesn’t modify the original array, we have to offset the second slice in order to get the ‘end’ portion of the array. Once we have done this, we concat the whole this back together and end up with our desired array.

The next condition is when the start position is longer than the length of the current array. When this occurs, we want to ensure the empty positions are retained using ‘undefined’. To do this, we initialize a new array whose length if the difference between the original array and the start position, then we concat the original array, with the spacer array and add the remote array. Le’ts see an example

var remoteArray = ["remote10", "remote11", "remote12", "remote13"];
var inPageArray = ["current1", "current2", "current3", "current4" ];
var finalArray = inPageArray.smoothInsert( remoteArray, 9 );
console.log( finalArray ); //current1,current2,current3,current4,,,,,,remote10,remote11,remote12,remote13

That’s it, now you have a built-in method to handle those more complex slice / concat scenarios. Enjoy!