4 ms·
Lots of good tips in here already. Yahoo has a great speed guide (http://developer.yahoo.com/performance/rules.html http://developer.yahoo.com/performance/rule
by SquareWheel 14y ago
Lots of good tips in here already. Yahoo has a great speed guide (http://developer.yahoo.com/performance/rules.html http://developer.yahoo.com/performance/rules.html) which I'd suggest reading through, they cover pretty much everything in this blog (and chrisacky's comment above), and go into some more detail.
For testing your site, I recommend WebPageTest (http://webpagetest.org/ http://webpagetest.org/). Run the test a couple times to get an averaged score, then start tweaking. Watch the HTTP requests. Watch the total download size.
Google also provides a Page Speed tool (https://developers.google.com/pagespeed/ https://developers.google.com/pagespeed/) (also built into Chrome) that will point out any mistakes you may be making.
The biggest things to focus on are caching, limiting HTTP requests (combining images into sprite sheets, bundling scripts), and optimizing images. Learn about these.
My favorite tools for optimizing images are PngOut (http://advsys.net/ken/utils.htm http://advsys.net/ken/utils.htm) and JpegTran (http://jpegclub.org/jpegtran/ http://jpegclub.org/jpegtran/). Both are lossless, I generally just run the tools batch through my websites image folder. If you want lossy Jpeg compression (you probably do, just keep the original file safe) then try Jpeg-Optimizer (http://jpeg-optimizer.com/ http://jpeg-optimizer.com/). If working with a large photo on the homepage or something like that, try multiple levels of compression and find the best quality/filesize tradeoff. You can often cut the filesize in half with no noticeable degradation at 100% zoom.