Sprite Image Aggregation

This is a consolidated list of web references to the CSS Sprite (image) aggregation technique that allows packaging an “unlimited” number of small images into a single file. This technique DRASTICALLY decreases page load times for sites with many images.

CSS Sprite Tutorial
http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/

Many CSS Sprite documents via Google
http://www.google.com/search?source=ig&hl=en&rlz=1G1GGLQ_ENUS295&q=css+image+sprite+create&aq=f
http://www.alistapart.com/articles/sprites/
http://websitetips.com/articles/css/sprites/


Online CSS Sprite Generator(s)
http://spritegen.website-performance.org/
http://www.csssprites.com/

Desktop CSS Sprite Generator(s)
http://smartsprites.osinski.name/
https://launchpad.net/css-sprite-generator/
http://www.ajaxperformance.com/2008/02/23/yay-the-css-sprite-generator-is-open-source-lets-play/

http://drupal.org/project/sprites


Don’t forget that there are other techniques to speed up web page load times … Such as:
· additional domains (for browsers with 2 port / domain limitations)
· using TCP keep alive
· adding expirations dates (to avoid round-trip HTTP 304 time waste)
· using compression
· aggregate CSS, JavaScript, XML, and other page components (allows TCP window size to reach MAX throughput);
JavaScript can be treated a bit separately, as it can be written “out of the html engine”
· reduce packet loss (avoid connection packet (SYN) disruption);
SYN packet loss can add 10-100 fold more time for page load than a lost data packet

Lastly, look into the multitude of tools (some free, some fee) for continued assessment. Start with MS VRTA, it requires .Net Framework 3+. Read Jim Pierson’s newest Nov 2008 MSDN article before firing up the utility.

The list below doesn’t get into toolsets for: Web Cache / Server; Application JVM / Java analysis (recommend CA Wily); Network Appliances (packet shapers, load balancers, firewalls, proxies, reverse proxies, routers, LDAP, DNS, DHCP, …); Network Security (IDS, IPS, …); Application Security (grey, black & white-box, …); Storage (SAN, NAS, …); Platform (*NIX, Windows, zOS, OS/400, VMS, …); DBMS (Oracle, SQL Server, Sybase, UDB, …); Middleware (); Capacity (); Simulation () … oh boy – what a list ….

As always, your mileage may vary …


Router & DNS Tools
VisualWare – VisualRoute (network path, latency, and packet loss traces)
http://www.visualroute.com/support/newrelease.html
Note: V13.x will have my adaptive ICMP packet loss included !!

DNSstuff – DNSreport (server health check)
http://member.dnsstuff.com/pages/dnsreport.php

IP server / protocol
Microsoft – PortQry (port analysis for various features such as LDAP, DNS, DHCP, …)
http://support.microsoft.com/kb/310298
http://support.microsoft.com/kb/832919
http://www.windowsecurity.com/articles/Mastering-PortQryexe-Part1.html
http://www.windowsecurity.com/articles/Mastering-PortQryexe-Part2.html

Microsoft – pathping (ICMP ping with packet loss)
http://www.microsoft.com/technet/prodtechnol/windows2000serv/reskit/cnet/cnbd_trb_vxmb.mspx?mfr=true

Portal / WAN performance
HP - SiteScope (portal / WAN analysis)
Product Pages
https://h10078.www1.hp.com/cda/hpms/display/main/hpms_content.jsp?zn=bto&cp=1-11-15-25%5E849_4000_100__
https://h10078.www1.hp.com/cda/hpdc/fetchPDF.do

WAN Monitoring Services
http://www.websitepulse.com/
https://www.alertsite.com/aslp_perf_mon.html?ascamp=web+site+monitoring

Microsoft - Virtual Round Trip Analyzer (web page load analysis)
http://msdn.microsoft.com/en-us/magazine/dd188562.aspx
http://www.microsoft.com/downloads/details.aspx?FamilyID=119F3477-DCED-41E3-A0E7-D8B5CAE893A3&displaylang=en

HTTP / HTML / JavaScript
Simtec – httpWatch (trace utility)
http://www.httpwatch.com/

IEinspector – HTTP Analyzer (trace utility)
http://www.ieinspector.com/httpanalyzer/index.html

IEinspector – IE WebDeveloper (trace utility)
http://www.ieinspector.com/dominspector/index.html

httptrace – TCP/HTTP (trace utility)
http://httptrace.sourceforge.net/

Firefox add-ons
Firebug https://addons.mozilla.org/en-US/firefox/addon/1843
Yslow https://addons.mozilla.org/en-US/firefox/addon/5369
Web Developer https://addons.mozilla.org/en-US/firefox/addon/60
YAPA http://www.websiteoptimization.com/services/analyze/


IP packets
WireShark – WireShark (packet trace & analysis)
http://www.wireshark.org/download.html