The Stats
- Service ordered: App Analysis + Lazy Loading
- Page template reference: Collection Page
- Testing tool: WebPageTest.org
| BEFORE | AFTER | % IMPROVEMENT | |
|---|---|---|---|
| Load time (document complete) | 11.65 | 3.67 | 68% |
| Fully loaded | 51.32 | 9.45 | 82% |
| Server requests (fully loaded) | 1687 | 144 | 91% |
Massive gains all around! 💪
Document complete = Time from start of page load until the window load event fires. Fully Loaded = Time from start of page load until there are 2 seconds of no network activity. Taking load time from 11.65 seconds to 3.67 seconds on mobile is a huge win for usability. I included the “Fully loaded” requests because at 1,687 there was clearly a problem, and solving this problem improved all other metrics. *Usually the site becomes interactive at document complete, while fully loaded is the time after all the extra javascript and app code fills in.The Screenshots
Before
Tested using webpagetest.org with mobile LTE 12Mbs connection speed.
After
Notes from Paul, the developer on this project
Here are some snippets from Paul’s report, to give you an idea of the process and how he was able to make such huge improvements:
We conducted a very thorough app analysis and didn’t notice any errors coming through on the
console or any network traffic containing errors, but app content currently takes up a total of ~38%
of your entire site…
A leftover image swap code was loading a lot of additional scripts (this may have been from a
previous version). This only seemed to be an issue on the collections pages, which were
sometimes taking almost a minute to finish loading [referenced above] but this seemed pretty consistent.
We also removed additional app code from the Pixel perfect app that may not have been
properly uninstalled and changed scripted events so that they no longer block the rest of the
page from rendering.
To see a sample report and our optimization process check out this post: Speed Boostr Optimization Services – What to Expect.