I have been focusing on an internet site, and we have handled to lessen the entire content for any page load from 13.7MiB's to two.4, however the page still takes forever to load.
It is a joomla site (ick), also it provides extensive redundant DOM elements (2000+ for that webpage), making 60+ HttpRequest's per page load, counting all of the css, js, and image demands. Unlike drupal, joomla will not merge all of them quickly, and they've to become stored separate otherwise the joomla components goes nuts.
So what can I actually do to enhance load time?
Things I have done:
- Added colors to dom elements which have large images his or her background therefore the color is loaded, then your image
- Reduced excessively large images to much more compact file dimensions
- Reduced DOM elements to ~2000, from ~5000
- Setup caching and gziping on server
Uncached size 2.4MB, cached is ~300KB, but even because of so many dom elements, the page takes some time for you to render.
Also can one caused by enhance the load time?
Read this article.
When the link will get removed or lost the various tools pointed out are:
- YSlow (by Yahoo)
- Google's Page speed
- AOLs web site test
- Smush.it (Image compression tool)
Perhaps you have enabled HTTP Compression (gzip) in your web servers? Which will lessen the transfer size all text-based files by 60-90%. As well as your page will load 6-10 x faster.
Search StackOverflow or Google based on how make it possible for it. (It varies per server software: Apache, IIS, etc).
Are the DOM elements necessary? If they're, can you really hide them because the page loads? Basically, you'd have your important need-to-be-there dom elements render using the page, after which once the document is loaded, you can unhide the relaxation from the elements as necessary
It may sound like you have done a fantastic job of working round the real problem: individuals giant graphics. You are able to most likely squeeze more efficiency from caching, minifying, etc., but there needs to be a method to reduce how big the pictures. I labored having a team of a few of the most discerning designers on the planet plus they never needed uncompressed JPEGs. Would you mean images withdrawn from Illustrator and saved on full quality (10)? If that's the case, the actual solution (and that i appreciate that you might not have the ability to make this happen) is to possess a hard conversation in which you show the look company, "You aren't your customers." If the objective of the website would be to only impress other visual designers using the fidelity of the imagery, it can be ok. If the objective of the website will be a portfolio that gains your organization work, they have to re-asses who their audience is and exactly what the audience wants. Which, I am speculating, isn't 2 minute load occasions.
Obviously, you will find plug ins for blending and mixing JS/CSS files: