Every second counts when we talk website speed. Just a second too long and you could have extremely high bounce rates from visitors thinking your site is broken or too slow. Having a fast server connection, high-end servers, and dedicated resources aren’t enough. The right kind of code matters just as much as the computers hosting the site. One way to speed up a site is by reducing HTTP requests, but how do you do it? Here are some ways to limit the number of times users must make requests from your server, which will lower the page-load times for your site.
What are HTTP Requests?
Each time a user types your URL into their browser, the site server sends files after the browser makes the request. To the user, it seems like only one request is made because they just type the URL in their browsers and a page pops up. However, on the backend several requests are made depending on the number of files that must be downloaded.
It’s not uncommon for a website to have a dozen include files in the header section of an HTML page. Every JSS and CSS file creates a request. Any images or external references create a request. You can test it yourself. Create a small HTML page with no includes, and then create one with all of the files and images added to your regular pages. Test the load times using tools such as Pingdom and you’ll see a change in speed.
Curious about the number of HTTP requests on your pages? Go to Developer Tools in Chrome and click the Network tab. At the very bottom of the list of events, it shows you the total number of requests.
Reducing the Number of Requests
Now that you have the number of requests, you can take steps to reduce them. Here are a few ways that you can lower that number.
- Use CSS instead of images
In the 1990s, most aesthetic components of a site were done with images. That habit has lingered on for some developers, but it’s a habit that should be broken. CSS can do most of your aesthetics even shadowing, which was previously done with images. Images should be replaced with CSS coding where possible.
- Combine CSS files
Using separate CSS files keeps your code organized but each of these files is a request. You probably don’t want to combine all of your files, but condense smaller files into one to reduce requests.
- Make JS asynchronous
- Reduce the number of plugins in WordPress
Developers and site owners love to check out the latest plugin. This is a great way to find out which one works best for you, but every plugin you install must load when users open your site. Most plugins have their own CSS and JS files included, and these files increase your HTTP requests.
- Use a canonical instead of redirects
Whether you have duplicate content or want to index HTTPS pages instead of HTTP, you have two options: redirects or canonicals. A canonical is a meta tag placed in your content. A redirect forces a new request from the server. Since the goal is to reduce HTTP requests, the better option is to place canonicals on your pages.
Each of these small tweaks can add up to large performance changes. Don’t forget that adding a CDN to your site also improves performance. Instead of relying on one local server, you can harness the power of data centers across the globe. It can especially help with WordPress sites when you’re unsure how to speed up performance and don’t know how to make technical changes to your code.