Speed up the interface loading by using CSS sprites for images

[oscar]

I think it would be a good idea to use CSS Sprites for all those tiny interface images found in RoundCube..

My current RoundCube installation loads about 35 images, which means 35 http requests. The idea is that you put all images in one large image, and then use offsets to display the correct portion of it. Nowadays when people have faster Internet connections, the latency of many small requests quickly adds up, instead of making one large, quick, request.

For a full explanation, see for example this site: http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/

For a site that helps you generate these kinds of images (and code), see here: http://spritegen.website-performance.org/

What do the devs say?

[oscar]

An interesting test is to look at the Net tab under Firebug, it shows individual loading times for all requests made to the web server. There's also http://tools.pingdom.com/fpt/ that shows the Connect time on every request (look at how long time it takes before the web server starts sending anything).

Ah well.. Hope I made my point clear :)

[till]

Interesting idea though I suspect that the math on this can drive one insane. Let alone the cross-browser issues (if there are any). Maybe you also want to email this to dev@ so others comment.

I am just putting this on 0.3-beta since 0.1.1 is bugfixes only.