September 7, 2017

Talk Nerdy To Me: Load Times

WRITTEN BY: Scott L.

Welcome to Talk Nerdy to Me, a series of fireside Slack-Chats where Pound & Grain’s resident tech geniuses explain complex development systems and best practices to a creative person. In today’s edition, Tech Lead Chris Ng explains the importance of keeping load times in mind when building interactive digital experiences.

If there’s one universal truth amongst the entire population of human beings in this digital age, it’s that load times suck. Plain and simple, no matter what you’re looking for online or how you’re consuming your digital content, when you need to wait for your result, it’s not particularly enjoyable.

Which brings us to today’s topic. Load times. They are as important as the content being served, and they need to be kept in mind when developing digital experiences. But how do you build a content rich and interactive digital experience with a minimal load time? I have no idea, but Pound & Grain’s Tech Lead Chris Ng sure does.

SLEW – Chris, why are load times so important for developers?

CHRIS – Well, they’re more important for users, so let’s say developers want to keep the user engaged.

SLEW – Makes sense – but just for us noobs, what typically causes long load times?

CHRIS – Four things come to mind. First, the “distance” from server to browser. Second, the amount of data (payload) being transferred both to and from the browser to the server. Third would be network latency and bandwidth. And finally, the time it takes the browser to render the request.

Nobody likes loading pages, even if there's a cool graphic

SLEW – Okay, so then how can you make load times faster?

CHRIS – With something like the number of hops from server to browser, use of a content delivery network (CDN) can help source the closest data centre to the user in order to have fewer bus stops to the destination, if you will. Large files like media (images & videos) are what benefit from CDNs the most. For text based content (HTML, CSS, JavaScript), we can configure the web server to compress them and thereby minimize the total payload being sent. Luckily, all modern browsers can decompress such responses, and when these are cached, load times are reduced even more. With network latency and bandwidth sharing similar solutions to the above. In some cases where we cannot avoid serving up a large payload, we can serve bits of content while giving the perception of interactivity to keep the user engaged.

SLEW – With all that in mind, what types of digital experiences are cause for concern when it comes to load times?

CHRIS – Things such as reading a blog, finding directions, making an online purchase, and of course watching movies… basically all the things. Because, who wants to wait for anything?

SLEW – Totally! What about testing? How does the dev team here at P&G test load times?

CHRIS – Two web services that we use to test load times are Test My Site by Google and Web Page Test. Both provide detailed reports on what we are doing right, as well as how load times can be improved.

Test load times to understand what you're doing right and where you can improve

SLEW – What are some best practices when building digital experiences?

CHRIS – First and foremost, choosing the right technology. For example, we would look at serving static or cached content that avoids hitting the database, which is a common bottleneck. An example of static content is the good ole’ HTML file. Say a site serves the same content to everyone, so after the first user requests that “page”, it is saved in a static format (cached) so that it bypasses the steps involved in the dynamic scenario.

SLEW – So when it comes to load times, it’s able to recall that information quicker and serve it up faster?

CHRIS – Correctamundo!

SLEW – Any other little tricks you like to use?

CHRIS – For web/application servers, we can put a load balancer in front of them to distribute the requests more evenly. We can also tell users’ browsers to cache things that don’t change often so it can be served up quicker the next time (for example, JavaScript libraries).

SLEW – Other than some of the solutions you’ve already shared, have you heard of any new methods you’re excited to try?

CHRIS – I haven’t played with Google’s Cloud CDN offering, but that could be a combination of such technologies as Redis and Memcached, which we have experience with in the Amazon Web Services realm.

SLEW – Thanks Chris, this has been great!

We live in a world where anything slower than instant is considered slow. So, as digital environments evolve and content and interaction become more prevalent to users, load times will continue being a hot issue.