Scripts At The Bottom Is Not Enough

You may remember one of the original webperf rules was to put scripts at the bottom.

Over the last few years browsers have been adjusting, now it is common for JavaScript to have higher loading priority via a pre-loader. This can result in scripts at the bottom effectively loading the same as scripts at the top.

Patrick Meenan on how it is supposed to work ( emphasis mine ):

– The preload scanner scans the whole document as it comes in and issues fetch requests.
– The main parser sends a signal when it reaches the start of the body and sends fetch requests for any resources it discoveres that are not already queued.
– The layout engine increases the priority of in-viewport visibile images when it does layout.
The resource loader treats all script and css as critical, regardless of where it is discovered (in the head or at the end of the body). see crbug.com/317785
– Resource loader loads in 2 phases. The first (critical phase) delays non-critical resources except for 1 image at a time. Once the main parser reaches the body tag it removes the constraint and fetches everything.

At this point you’ll likely need to use async/defer to really push JavaScript loading out of the critical category. Of course that isn’t a slam dunk either. Paul Irish notes this limitation with IE:

TL;DR: don’t use defer for external scripts that can depend on eachother if you need IE <= 9 support

Even after 20 years of development there are days where browser environments still feel like the wild west.

The Chrome 41 Bump

Patrick Meenan mentioned first paint time improvements in Chrome 41. I noticed a ~25% improvement in the first view SpeedIndex times for one of our tests. It was easy to spot when the auto update from Chrome 40 to 41 happened:

chrome-41-bump

I compared the individual tests before and after the update and this really is all about first paint times. The total time for the page to be visually complete was roughly the same.

WordPress.com #3 in Worldwide DNS Performance

Two weeks ago I mentioned dnsperf.com. After that I reached out to @jimaek about adding WordPress.com to the list of measured providers.

It has been super exciting to see WordPress.com DNS performance rank #3 worldwide:

dnsperf-wpcom-1

We are behind second place EdgeCast by just 0.66ms.

Serious kudos to our systems and network operations teams on including DNS as part of our Anycast network, which made this level of performance possible.

Little Steps

Richard Hipp on improving SQLite performance, 50% faster than 3.7.17:

This is 50% faster at the low-level grunt work of moving bits on and off disk and search b-trees. We have achieved this by incorporating hundreds of micro-optimizations. Each micro-optimization might improve the performance by as little as 0.05%. If we get one that improves performance by 0.25%, that is considered a huge win. Each of these optimizations is unmeasurable on a real-world system (we have to use cachegrind to get repeatable run-times) but if you do enough of them, they add up.

More often than not getting a big improvement in performance is about doing lots of little things.

perfmap

Xiao Yu mentioned perfmap at work last week:

A bookmarklet to create a front-end performance heatmap of resources loaded in the browser using the Resource Timing API. A browser with support for the Resource Timing API is required.

It gives you a quick way to see how far into the page load images on the page finished loading.

perfmap

If you are going to use this regularly I’d recommend editing the bookmarklet to load perfmap.js from a trusted source that you control.

The Value Of 5.2 Milliseconds

“Project Express” from Hibernia Networks is a new trans-Atlantic fiber connection from New York to London. It was started in 2011 but isn’t expected to be completed until later in 2014. From a 2012 Bloomberg news article about the project:

Project Express will be the fastest cable across the Atlantic, reducing the time it takes data to travel round-trip between New York and London to 59.6 milliseconds from the current top speed of 64.8 milliseconds

The cost for this new, shorter, fiber line is reportedly over $300M. A big price tag for a 5.2 millisecond reduction in round-trip time.

hibernia-express

It should come as no surprise then that the main customer base for this new connection is high speed trading companies.

Full Page Prerendering in Chrome

Steve Souders takeaway #1 after trying to figure out unexpected caching behavior in Chrome ( emphasis is mine ):

Remember that Chrome may do DNS prefetch, TCP pre-connect, and even prerender the entire page based on the confidences in chrome://predictors.

Apparently this isn’t new information, it was mentioned by Ilya Grigorik in High Performance Networking in Google Chrome. But if Steve Souders didn’t know about it already then I expect that it isn’t widely known.

Looking over the chrome://predictors/ results in my browser it is about what I’d expect. One thing that would be helpful is the ability to sort by individual columns. I’m most interested in which pages Chrome is mostly likely to attempt to prerender.