Learning track

Site speed

Site speed is not a number, it is a handful of decisions taken in different places along the route: on the server, on the network, inside the browser and inside the page itself. This path opens those decisions in an order that leaves you able to say where your page actually spends its time.

  • 10 lessons
  • Free, no signup

That one score, and the six things underneath it

The score everybody looks at

One number combined from several metrics. Good for comparing two versions of one page and nearly useless for finding out what is broken.

The waterline: where reading the report ends and the work starts

  • Server response

    Until the first byte arrives the browser has nothing to start on. Caching and hosting decide here, not the theme.

  • The rendering path

    What stops the first paint and what does not. The shortest lesson in this path and the most used.

  • Image weight

    The largest part of the weight of most Persian pages, and the easiest thing to fix.

  • Third party JavaScript

    Chat widgets, analytics, ad pixels. Code you did not write and that usually nobody owns.

  • Persian fonts

    A problem a Persian site has and an English one does not. A whole lesson of this path belongs to it.

  • The caching layers

    The deepest layer, because there is more than one of them and when it breaks it looks like something else breaking.

The order below the water is not an order of importance, it is an order of distance from the eye. On a particular site the deepest row may be the most important one, and the only way to know is to measure.

The path, step by step

Lessons are ordered so each stands on the previous one. You can also jump in anywhere.

  1. 1Why site speed mattersSite speed matters, but not for the reason it is usually sold: its effect on Google rankings is small and conditional, and its effect on the person waiting in front of the page is large and immediate. This lesson draws the line between those two using Google own documentation and our own measurements.Beginner
  2. 2How a browser builds a pageThe browser reads HTML from the first byte and builds the page tree as it goes, but it draws nothing on screen until it has understood the CSS, and if it reaches an ordinary script it stops right there. Every piece of speed advice you will hear along this path comes out of those two sentences.Beginner
  3. 3Core Web Vitals in depthCore Web Vitals is three numbers measuring three completely different things: LCP for how fast the largest element of the page appears, INP for how fast the page answers a click or a tap, and CLS for how much the layout shifts on its own. Google judges all three not from your test run but from the 75th percentile of real visitors, segmented across mobile and desktop.Intermediate
  4. 4How to measure site speedMeasuring site speed means taking one lab report, putting it next to data from real users, and picking a single task out of both. The hard part is neither taking the report nor understanding the numbers, it is resisting the pull to fix everything the tool marked red.Beginner
  5. 5Optimising images for the webOptimising an image is three jobs, in this order of importance: resizing it to the size actually displayed, sending it in a modern format, and declaring its dimensions explicitly in the HTML. An image that earns nothing, though, is better not sent at all; that one comes before all three.Beginner
  6. 6What caching is, and its layersA cache keeps the result of a piece of work so the same work is not done again next time. On this site, the same page at almost exactly the same byte count takes 23.5 ms from cache and 155.5 ms without it for its first byte to arrive.Beginner
  7. 7Optimising CSS and JavaScriptOptimising CSS and JavaScript is three jobs, and they are worth doing in this order: delete what is not needed, send later what is not needed immediately, and shrink what remains. On this site, minifying the main stylesheet saved 16.3 KB on the wire, and one analytics file we did not write takes 171.1 KB.Intermediate
  8. 8Persian fonts and site speedA Persian font is heavier than its Latin equivalent, but the biggest saving does not come from making the file lighter; it comes from not sending files that are not needed. This site writes five weights in its stylesheet and sends only three font files, 74.6 KB in total.Intermediate
A giant black stopwatch with four glowing gates in red, green, blue and white and one light streak racing around it

The order of these ten lessons comes from a simple rule: until you know what the browser does, every change you make to site speed is a prescription somebody handed you and you cannot repeat it. So we start with the real effect of speed, then the route a page takes inside the browser, and only after that with measurement, images, caching and fonts.

One thing has to be said at the start, because we also sell speed work: a large part of what is written about speed ties it to Google rankings and inflates it. This path does not do that. Wherever a number appears it comes either from Google own documentation or from our own measurements on this server, and every lesson states for itself where its advice stops working.

This path sits on top of web design and answers part of what the SEO path asks, but neither is a prerequisite. What you need is access to your own site and the patience to measure before and after every change. Anyone who picks up that habit is free of half the arguments about speed.

Real follow-up questions

Do I need to know programming to start this path?

Not for the first six lessons. They are about understanding and they run with a browser and your own site. The two lessons on code and WordPress assume you have access to your site settings, but they still do not ask you to write code.

My site runs on WordPress. Should I jump straight to the WordPress lesson?

You can, but you have then done the exact thing this path tries to prevent. That lesson is a list of actions, and without lessons two and four you cannot say which of them fits your site. The genuinely shortest route is to read lesson two and then go to the WordPress one.

Why is there no list of the best speed plugins in this path?

Because such a list goes stale within a year and, more importantly, the right choice depends on your site rather than on somebody ranking. Where a plugin is needed, the lesson says what that plugin has to do and how you check whether it did it; naming one is the easier job and the less useful one.

This path is written for someone who wants to work out for themselves where their page spends its time. If your numbers are genuinely bad and you would rather have someone do the work, you can also test your site there with the Lighthouse engine; see the site speed page