Hi All
I’m new to this site/forum and am trying to analyse my shop’s speed.
My website is Joanie’s Gifts
The speed test result is showing the site is really slow but I’m having difficulty understanding why. The DomContentLoaded part in particular is going very slowly.
The page I’m trying to analyse is my East of India Gifts Page which is a fairly heavy category page.
My shop is running the latest version of Opencart on a pretty good VPS server so I really am not sure what’s going wrong.
Can somebody give me a starting point?
I think the webpagetest is making my site seem 50% worse than it actually is but i still want to improve. Any help would be appreciated.
Hi Joan, here’s my 2 cents. I would recommend using a Chrome extension called YSlow, it will give you some very specific steps and give you a “grade” on performance.
I’m not familiar with Opencart so I checked them out online and went to perrysnuthouse.com (which was listed as a customer on their reviews). You have 112 requests compared to their 33. Each request is carrying overhead that will slow your site down.
Since I’m not familiar with Opencart, I don’t know how much control you have, but ideally the CSS and JavaScript files should be merged and minified to create a single JS and a single CSS file. (If possible).
You may also benefit from restructuring your HTML to move JavaScript to the bottom of the page, users don’t mind seeing a page loading but a blank/white page seems to frustrate them.
All of that is outlined in the YSlow analysis. Good luck!
Well, at 180ms your TTFB is fine, which is saying that your server is tuned well for your current load.
page size is great at < 1MB.
120+ files is pretty high, can you implement any sprites?
There are 2 things, apart from implementing sprites that need looking at:
Your server is very slow at delivering static resources. Implementing a CDN is probably the simplest solution there, although careful webserver tuning should help ( mod_cache using in -memory resource if enough memory available, or my standard answer - switch to nginx! )
what is all that javascript doing! Analyse and throw out as much as possible…
If you use Chrome as a test browser you can enable timeline capture which will tell you exactly what the js code is doing (assuming it is slow in Chrome as well).
As far as the DOMContentLoaded goes, looks like something attached to jQuery’s Document.Ready is looping through the DOM looking for positions on things which is forcing a lot of layout events and style recalculations.
From a little poking around it looks like it is coming from journal.js, possibly where it is iterating through the mega-menu-item items and querying the height on each one.