Zapdos
Power Member
- Oct 22, 2011
- 597
- 710
Usually if I'm allowed full access and the freedom to do whatever I think is best: <1 sec.
All I use is:
- Caching. Application and server level
- Minifying. CSS and JS can be reduced alot
- Compression. CSS and JS can yet again be reduced alot, along with the page itself
- Optimized images. Unless you need transparency or 1:1 quality it's almost always better to use jpgs for full photos. For smaller thing PNG I find comes out ahead in size lots of times.
- Proper headers. If the content doesnt change, set a long expires header so it won't request it.
- CDN. Images on a CDN along with javascript libraries. I always use googles cdn for things like jquery, mootools.
- If the budget is limited/not allowing for a CDN, use a local "CDN". Make a subdomain and put your static files on it. A subdomain is considered a new domain by browsers and essentially bypasses the concurrent thread limit (usually 3). This could potentially reduce load time by half. Image heavy sites could use something like: images.example.com (user images) static.example.com (js+css+layout)
- Lazy loading. If its an image heavy page, lazy loading is the way to go. It saves your viewer lots of bandwith (you too) and reduces load time. If you dont know what this is, it only loads the images in the viewport. If the viewport hasnt seen it, it doesnt load. You could stick 1000 images on 1 page and still only load 1 image.
If not:
1->30 seconds.
One client has tens of thousands of htaccess directives. The template system is destroyed by bypassing it and using PHP directly. There's atleast 500kB of javascript on the page due to sharethis, FB, twitter, sharethis, translate, livechat, popups etc.... Needless to say it takes forever to load.
All I use is:
- Caching. Application and server level
- Minifying. CSS and JS can be reduced alot
- Compression. CSS and JS can yet again be reduced alot, along with the page itself
- Optimized images. Unless you need transparency or 1:1 quality it's almost always better to use jpgs for full photos. For smaller thing PNG I find comes out ahead in size lots of times.
- Proper headers. If the content doesnt change, set a long expires header so it won't request it.
- CDN. Images on a CDN along with javascript libraries. I always use googles cdn for things like jquery, mootools.
- If the budget is limited/not allowing for a CDN, use a local "CDN". Make a subdomain and put your static files on it. A subdomain is considered a new domain by browsers and essentially bypasses the concurrent thread limit (usually 3). This could potentially reduce load time by half. Image heavy sites could use something like: images.example.com (user images) static.example.com (js+css+layout)
- Lazy loading. If its an image heavy page, lazy loading is the way to go. It saves your viewer lots of bandwith (you too) and reduces load time. If you dont know what this is, it only loads the images in the viewport. If the viewport hasnt seen it, it doesnt load. You could stick 1000 images on 1 page and still only load 1 image.
If not:
1->30 seconds.
One client has tens of thousands of htaccess directives. The template system is destroyed by bypassing it and using PHP directly. There's atleast 500kB of javascript on the page due to sharethis, FB, twitter, sharethis, translate, livechat, popups etc.... Needless to say it takes forever to load.