Current time: 12-15-2019, 12:18 PM Hello There, Guest! (LoginRegister)

Post Reply 
 
Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
07-19-2016, 11:33 PM (This post was last modified: 07-19-2016 11:40 PM by mbreest.)
Post: #1
Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
Hi guys,

I am currently working for Spreadshirt in the role of a Performance Engineer and we recently released a new version of our marketplace. Currently, we are trying to identify things we can further improve and in order to do that I run a couple of tests with WebpageTest on our pages to get metrics that describe the current state.

In general, I run 5 tests per test with Chrome browser and Cable from the Dulles, VA - Thinkpad T430 location. I also made a copy of our live list page that runs without Javascript and can be found here https://www.spreadshirt.de/Public/esi/ump-list-progressive-jpg.php.
The problem with the WebpageTest result is that the Start Render time for the 5 tests I make toggles between 1 and 2.5 seconds which make the test result not very reliable (http://www.webpagetest.org/result/160718_EY_1AEP/). When running the same test with Firefox, IE11 or Safari I get a pretty consistent Start Render time around 1 second (http://www.webpagetest.org/result/160718_4G_1A0Y/).

Has someone an idea on why the Start Render time toggles in Chrome? Is this a problem related to my page or is this a problem with Chrome in general? Any ideas?

Thanks for your help!

Cheers,
Martin
Find all posts by this user
Quote this message in a reply
07-20-2016, 12:22 AM
Post: #2
RE: Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
If you go to the "Chrome" tab in the advanced settings you can capture a dev tools timeline which would give some visibility into what Chrome is doing right before the delayed start render which might provide visibility into what is going on.

If that doesn't provide enough detail you can also capture a trace but that's more for people to look at the internal Chrome processing and is geared more towards chrome developers themselves. That said, if you can run a test with multiple runs and timeline (or tracing) enabled and reproduce both fast and slow start renders I'd recommend opening a Chrome bug at crbug.com with a link to the results.
Visit this user's website Find all posts by this user
Quote this message in a reply
07-20-2016, 08:01 PM (This post was last modified: 07-21-2016 12:20 AM by mbreest.)
Post: #3
RE: Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
Hi Patrick,

thanks for the quick answer!

I did run the tests again as you said and enabled the "capture dev tools timeline" feature http://www.webpagetest.org/result/160720_13_1W5F/. What I can see now is that the difference between Start Render firing after 1 second or 2.5 seconds is that Layout and Parse HTML simply takes a lot longer. I have the same behaviour on the Repeat View.

Can this problem be related to the 48 images I have on the page and the decompression of those that interferes with the actual parsing of the HTML?

When looking at the Chrome trace the only obvious difference between this trace http://www.webpagetest.org/chrome/trace....1&cached=0 and this trace http://www.webpagetest.org/chrome/trace....2&cached=0 is the TimeoutMonitor seems to have more to do and that LayerTreeHostImpl::SetVisible takes much longer.

I will create a new test page with 12 images on it instead of the 48 ones and see whether this one runs more stable. There is one special thing about the page: We use http/2. Can this be the reason?

Cheers,
Martin
Find all posts by this user
Quote this message in a reply
07-23-2016, 05:35 AM (This post was last modified: 07-23-2016 05:39 AM by ajm_76.)
Post: #4
RE: Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
Chrome has indeed been quite erratic for a little over a week(ish).

(Example) Expected behavior/what we've seen for months with statistically insignificant deviation: http://www.webpagetest.org/result/160722...3/details/

The rest in a nine test run, unexpected and new: http://www.webpagetest.org/result/160722_AM_17DN/

Things that now seem to randomly block paints:
  • Asynchronously loaded/Deferred JavaScript
  • Pre-rendering
  • Deferred CSS (even with RequestAnimationFrame)
  • Analytics, including asynchronously loaded G.A.
  • Images that shouldn't
  • Fonts that shouldn't, including TypeKit and Google Fonts asynchronously loaded with the WebFont Loader

I see no pattern, really. As I understand it, Chrome runs its own experiments(?). Perhaps it is now self-aware lol.

Be well,
AJ
Find all posts by this user
Quote this message in a reply
07-25-2016, 06:49 PM
Post: #5
RE: Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
Hi AJ,

thanks for your answer. The list of things you provided that might block paints randomly is pretty interesting. Will have a closer look at that and conduct a couple of more tests. We do have embedded a Google font for example.

Anyway, I conducted a test with 12 images on the page instead of 48 images and have similar symptoms http://www.webpagetest.org/result/160722_33_CYH/. So this is probably not it (means bandwidth, cpu usage, image decoding, ...).

Will create a simple test page with the 12 images from scratch now without any Javascript, CSS, Fonts etc. and work my way through it step-by-step.

Cheers,
Martin
Find all posts by this user
Quote this message in a reply
07-27-2016, 12:13 AM
Post: #6
RE: Start Render time toggles between 1 and 2.5 second in Chrome browser on Cable
Hi guys,

I created a couple of test pages and further removed resources and markup step-by-step:
* version with images but no other resources (like css, js) and original html markup has the problem - http://www.webpagetest.org/result/160725_GN_PQ9/
* version with images but no other resources and with head and foot removed does not have the problem - http://www.webpagetest.org/result/160726_GV_EJD/
* version with images but no other resource, with head and foot removed and with further markup reduced and markup bugs fixed does not have the problem and start render starts really as expected http://www.webpagetest.org/result/160726_HR_KKB/

So this problem must be somehow related to our head or foot or something funky in our markup. Strange!

Cheers,
Martin
Find all posts by this user
Quote this message in a reply
Post Reply 


Forum Jump:


User(s) browsing this thread: 2 Guest(s)