Performance Matters: Optimizing Page Load

3.1 Server-Side Optimization

The overall performance optimization should start on the server side. Why? Because well it's the server that will serve you. Yeah, that will transfer those files that you need basically. So if you're not sure how this works, you have the browser and then the browser makes a request for some files to the server. HTML documents, images, CSS, JavaScript, whatever it is. So the server gets that request and it will send you that information and if the server is slow, then that information will be downloaded slowly. So the first thing you need to do is get a decent web host. And how do you do that? Well it depends on your needs. Do we need loads of space, loads of subdomains or email addresses? There are loads of providers that will give you this, but what you need to do is check how stable the server is and how fast the connection speed is. So how do you check how fast it is? Well it's simple. Find the website that's hosted there and see how fast that is. And also, be careful about the hosts that offer you unlimited bandwidth. Because, what they will do most of the time is put a lot of websites on the same server and depending on the machine configuration, this could have a big impact on the page loading speed. Now, I won't go over in too much detail about how to choose the host. For that, check out the lesson notes where you'll find some more reading resources. Now apart from choosing a good web host, you also need to consider redirects, because redirects are used to guide a user from an old page to a new one. But the problem is they take or they create additional HTTP requests. So even more time is spent communicating with the server to get to the desired page. So, always try to minimize the redirects and also, if you can, remove them completely. Now the final thing that I wanna talk about here is about DNS lookups. Now DNS lookups might seem something a system admin should handle, but the truth is, the way you write your code is very relevant to this. So, first of all, let's see how a DNS lookup works. The DNS, or Domain Name System, basically associates an IP address with a host name. So every website out there has an IP address associated to it. For example, if someone would access tutsplus.com, then something called a DNS resolver will associate or will actually return the IP address associated with tutsplus.com. So the DNS basically looked up that IP address for the host name and returned it. The problem is this has a cost. According to this post on Yahoo! Developer Network, it typically takes between 20 and 120 milliseconds for DNS to look up the IP address of a host name. And during this time, the browser can't download anything, it's stuck. Now, you might be saying, well, this is all and well, but why should I care, because the browser does that anyway, right? Right, but it does that for every unique host name it finds in our website. And that includes everything, images, scripts, Style sheets, whatever it is. So for example, if you're downloading font Awesome and then downloading another font from google fonts, and then an image from Flickr and maybe a video from YouTube, you have four distinct DNS lookups. And not to mention the main DNS lookup for the main domain, basically. So in this case, you should limit the number of distinct host names. For example, if you're downloading a bunch of images from external sources, try to put them all under a single host name. And the same goes for images and for style sheets and scripts. Excuse me. So these are just a few things you can do to start the optimization on the server side. Another thing you can do is reduce the number of HTTP requests. Why? You'll find out in the next lesson.