Web Performance 5 lessons
  1. 1 Why it is eight seconds here and two abroad
  2. 2 Images, fonts and the heavy things sign in to open
  3. 3 Caching, compression and delivery sign in to open
  4. 4 The metrics search engines measure sign in to open
  5. 5 Keeping it fast sign in to open
Course overview
Data: video · change

This lesson: 122KB

Web Performance · Lesson 1 of 5

Why it is eight seconds here and two abroad

Find where the time actually goes.

A site that loads in two seconds on a European test and eight seconds in Lahore is usually not a code problem. It is distance, and then weight.

Distance. Every request to a server in Frankfurt makes a round trip, and each one costs real time before a single byte of content moves. A page needing thirty separate requests pays that cost thirty times. A content delivery network puts copies near your users and removes most of it, and for a site serving Pakistan it is often the single biggest improvement available.

Weight. Mobile data is slower and it is paid for. A five megabyte page is both slow and expensive for the person loading it.

Blocking. A stylesheet or a script in the head stops the page rendering until it arrives. One slow third party script in the wrong place holds the entire page hostage, and the third party has no reason to care.

The server. A page that takes two seconds to generate before it sends anything cannot be fixed in the browser. Usually a slow query, often the N plus one problem.

Measure before you change anything. Use a tool that lets you choose a test location and set it to somewhere near your users; a test from a data centre in Virginia tells you nothing about a customer in Multan. Then read the waterfall, which shows every request and how long it took. The bottleneck is almost never where people guess.

Lab — try it yourself

Run a speed test from a location near your users and read the waterfall. Write down the three slowest requests before changing anything.

Check what you learned

Create your free BvLogic ID to take the quiz and record your score.

Create your BvLogic ID
Continue to lesson 2 Up next 2. Images, fonts and the heavy things