Designing Faster Sites

Most of the time we don't think about the way a page is styled or the HTML output could affect performance for users.

However you'd be surprised that the location of a css file or adding an additional meta-tag could give your site performance gains.

Most of the details of how to improve your site is talked about in this article.

Just a few highlights to mention:

* Loading CSS files at the head tag
By moving the CSS file as high as possible in the page gives the appearance the page is loading quicker. This is because the browser is able to download the CSS and begins rendering the styling earlier

* Use Expires or Cache-Control
By adding meta tags to tell the browser when to cache/not cache content can help save performance. This alleviates the amount of content the browser needs to download from the server.

* Put Javascript At The Bottom
If you can placing the Javascript at the bottom of the page helps parallel downloads in the browser (e.g. download images in parallel before Javascript is loaded). Javascript traditionally wasn't downloaded in parallel because of the order that Javascript needed to be executed and the changes that could be made to the DOM.

* Use GIFs over JPEG when possible
Smaller files that's why.

* CSS and Javascript As External Files
So that these files can be cached by the browser.

Also check out YSlow - this firefox plugin tells you what parts of your site (e.g. images) causes performance impacts on your site

I'll definitely be rolling these changes out myself on my site

Design & Markets

My friend introduced me to Etsy a few years ago (www.etsy.com) and lately, I have found myself addicted to the site. Etsy is mainly a site where people sell handmade items. I have noticed that vintage has it's own category on Etsy and I have lately been coming home from work and browsing the site for vintage treasures.

I should also talk about the handmade items that are sold. There are some pretty funky designers out there who create awesome handmade items such as jewellery, bags, t-shirts etc... It's like an online market place.

I love going to the markets - in Sydney I particularly recommend Glebe and Paddington, but you can also find pretty good stuff at Bondi markets, Kirribilli markets as well.

JMock and Multi Threading

I came across a problem recently regarding jMock and threading.
The problem was that the test seemed to have "passed", but the expectations set on the mock object were not executed.
The cause of this was because the test's thread was separate to the thread spawned by the program.

According to jMock - threading should be covered by integration testing, while jMock is meant to be used for unit testing - as such multi-threading is not supported.
However,there is a way around this...

Instead of spawning a thread in the program - create an interface which can be mocked. The implementation of the interface would have a method that accepted a Runnable class, and the thread would be spawned in this method.
The test would have it's own implementation of the interface, but instead of spawning a thread, the test would just execute the run() method of the Runnable class.

Here's a simple example:

public interface Runner {
    void start(Runnable handle);
}

public class RunnerImpl implements Runner {
    public void start(Runnable handle) {
    	Thread t = new Thread(handle);
    	t.start();
    }
}

public class ThreadHandle implements Runnable {
	public void run() {
		//actual behaviour when the thread runs
	}
}

public class Server {
	private Runner runner;
	private ThreadHandle handle;
	
	public Server (Runner runner, ThreadHandle handle) {
		this.runner = runner;
		this.handle = handle;
	}

	public void startUp() {
		//code...
		
		runner.start(handle);
	}
}

This would be the implementation class that the test would use:

public MockRunnerImpl implements Runner {
	public void start(Runnable handle) {
		handle.run(); //call run of the Runnable class instead of creating a thread and calling start()
	}
}

Another way around this is to use Executor - this is described on jMock's site here

While I'm on the topic of jMock, another tip (applicable to 1.x versions) - when mocking concrete classes, use cglib. An example of this can be found here