Help understand waterfall after using 3rd party image service

Hello,

I was hoping someone might be able to help me understand the results from this test: WebPageTest Test - WebPageTest Details

I’ve been testing out using a 3rd party service, Imgix, to serve our images so we can make use of a CDN, image optimisation and resizing.

However, I seem to find that when I have a page that requests lots of images then the TTFB for each image increases massively. Some of these are less than 1kB and taking nearly 5 seconds.

Is this a result of the browser blocking as it can only handle so many requests at a time from a single host? Why then is there a large gap further down the waterfall before a script starts to load. I thought with Chrome it could handle say 6 requests to the same host but could handle around another 4 but in this case it looks like the image requests are blocking.

Any help with this would be greatly appreciated.

Many thanks,
Jeff

Hi Jeff,

The pattern you’re seeing is typical HTTP/2 behaviour - the browser dispatches all the requests together and then the server schedules the responses back, and in Chrome’s case it requests they be sent in series rather than interleaved

You can create a HTTP/1x waterfall for comparison by using --disable-http2 in the Chromium command line field, and in H1 you should only see 6 or so simultaneous requests for images at any one time

You can get a picture of how well the connection is being used by looking at the connection chart that’s below the waterfall.

In your test the latency is set to 150ms so that adds some delay but it also looks like the images are coming from Imigix’s origin rather than the CDN edge nodes which is adding a further delay (and should be queried with them)

One thing you could do to encourage the browser to connect to Imigix earlier is add a preconnect header e.g. Improving Perceived Performance With the Link Rel=preconnect HTTP Header

The delay before the scripts from request #62 on is due to the scripts being inserted via the tag manger GTM in your case - not sure what the impact of the multiple tag containers is having on when those scripts run.

Ping me via email or Twitter if you’ve questions, or my explaination’s not clear.

Andy