Performance Matters: Optimizing Page Load

2.1 Overall vs. Perceived Performance

Let's talk about two concepts, overall performance and perceived performance. Now, overall performance basically means how fast your website loads. And this depends on the page weight, it depends on the number of HTTP requests, and so on. So basically, the faster a website completely loads or is downloaded to the client, then the better the performance. Now, the perceived performance is a bit different. It doesn't refer to how fast the web page loads. Instead, it refers to how quickly that web page is usable because, let's think about it, no matter how big or how slowly a website loads, initially, you're only gonna see a small portion of it. This, of course, depends on your device, so if you're using a smartphone you're gonna see less on your screen initially than you would see on a desktop. Now the problem with most websites is that everything loads at the same time. But if we think about it, why not load the visible part first, as fast as possible, and then download the stuff below the fold? Because you can only see so much initially. So get that as fast as possible so the web page is usable faster. And then worry about the stuff that you cannot see in the beginning. And that's what perceived performance is. How fast do you feel that the page has loaded, right? So if you get that initial content really fast it doesn't really matter if the rest of the content that you can not see initially takes one, two, three extra seconds to load. Now ideally you would want to optimize a website from both perspectives. So make sure it loads very fast but also make sure it's useable really fast. And the next two chapters will teach you how to do just that. But before we do that, before we do any kind of optimization, we need good tools that will help us measure our progress. And the first tool, which is probably the most accessible is Google's dev tools. So that's coming up next.