Site improvements - CSS sprites

[subscribe] Recent blog entries

• Simple prototypal inheritance new!
• Adventures in Rhino - setters and getters
• Site improvements - fighting with Disqus
• JavaScript task chaining
• JavaScript string building benchmarks
• Efficient JavaScript string building
• Alternative JavaScript worker thread API
• Implementing JavaScript worker threads
• Thread safe DOM manipulation
• Site improvements - CSS sprites
• Trephine worker threads made easy
• Pitfalls of multithreaded browser development
• Site improvements - reducing dependencies
• The unsplittability of XML

Live Demos

• Executing arbitrary script
• Shell commands
• File browser
• Excel data extractor new!
• Persistent client side database
• Groovy demo
• JavaFX demo
• Ruby demo

Site improvements - CSS sprites

In an ongoing quest optimize the trephine.org site, today marks a further reduction in the number of requests it takes to load a page on this site. Previously, a page like this one would require about 22 requests to load, now it takes about 14.

This time the reduction is due to the institution of a CSS sprite map. Previously, a separate image was used for each icon on the page, such as in the navigation tabs and the RSS feed icon in the Recent Blog Entries sidebar. Now there is only one image, which serves the same purpose, reducing the number of requests that the browser has to make from 8-10 to just 3.

If you notice anything funny about the site, please hard-refresh (usually Ctrl+F5 in Windows/*nix and Cmd+F5 on Mac OS).

There are plenty of sites which describe how to create and configure sprite maps, so I won't dwell on it here, suffice it to say that this should prove to be a marked improvement on initial load speed for first-time visitors.

The next step to increase the speed of the site is to migrate the static content off of the web server to dedicated static content servers. After that, the only way to get better performance will be to migrate to a more powerful host and implement caching optimizations such as integrating memcache support to reduce DB queries, or putting a squid reverse proxy server in front of apache.

Anyway, just another housecleaning day which will hopefully improve the site's responsiveness for everyone. I'll be happy to answer any questions or provide links to more detailed descriptions of the technologies which I alluded to above.