Skip to main content

Reduce HTTP Requests on WordPress

Looking to reduce the HTTP requests on your WordPress website? When you’re trying to speed up your WordPress site, there are some simple non-technical solutions that make a great starting point, like choosing a quality WordPress host and using a WordPress caching plugin.

But once you’ve handled the basics, you might want to go a little further to make your site load even faster.

And that brings me to today’s post about HTTP requests in WordPress, and how you can analyze and reduce them to speed up your site. This topic is naturally a little technical, but I’ll try to make it as casual-user-friendly as I can.

Here’s everything I’ll cover:

  • What HTTP requests are and why they matter for your WordPress site
  • How to analyze your WordPress site’s HTTP requests using GTmetrix
  • Five tips for reducing the number of HTTP requests on your WordPress site

What Are HTTP Requests in WordPress?

When a person visits your WordPress site, their web browser needs to collect a lot of information to properly render your site.

It needs the HTML for the basic content, CSS to make things pretty, any image files, JavaScript files…you get the idea. While your readers see one cohesive website, it’s actually made up of lots of separate pieces of information.

To access these resources, your visitor’s browser needs to ask for them, which it does in the form of an HTTP request.

For example, if a browser needs an image to display in your blog post, it sends out an HTTP request for that specific image. If it needs a CSS file to decide how to render your content, it sends out an HTTP request for that CSS file. If it needs a Google Analytics tracking script, it sends out an HTTP request for that JavaScript file.

Get the idea? Each HTTP request is a request for another bit of information to help the brwoser build the page.

You can have both internal and external HTTP requests. For example, a browser might request both an image from your WordPress site’s server and a tracking script from an external server, like Google Analytics.

The number of HTTP requests that are required depends entirely on the site.

For example, my simple WordPress portfolio site only needs 18 requests, while the New York Times website has 231 requests, in large part because of a huge number of tracking scripts.

Why Do HTTP Requests Matter for WordPress Sites?

You can probably see where this is going…

In general, if a browser needs to make more HTTP requests, it’s going to take longer to load the page because it needs to request a lot more information. If you can remove some of those requests, there’s less to load, which means your site loads faster.

A basic rule of thumb is that “fewer HTTP requests = a faster-loading WordPress site“.

Of course, it’s not quite that simple because not all HTTP requests are created equal. Requesting a tiny tracking file might only take a tiny fraction of a second, while requesting a huge unoptimized image could take half a second.

So if you want the more specific version, it’s something like…

  • Eliminate unnecessary HTTP requests to have as few requests as possible
  • Pay special attention to slow HTTP requests as they have a larger impact

How to Analyze HTTP Requests in WordPress

The best way to analyze your site’s HTTP requests is with something called a waterfall analysis. This analysis shows you:

  • How many overall requests your site has
  • Each individual request
  • How large each request is
  • How long each request took

Most performance testing tools can help you perform a waterfall analysis, including:

I’m going to use GTmetrix for these examples because I like its interface, but the basic idea is the same across all the tools.

To get started, you go to GTmetrix and plug in the URL that you want to analyze. GTmetrix will give you a high-level look at the number of HTTP requests in the Page Details section, but you want the Waterfall tab for a deeper look:

GTmetrix results

Here’s what the Waterfall Chart looks like:

Waterfall analysis

And here’s what the columns mean:

  • URL – this is the specific file that was requested. You can filter it to find the HTTP requests added by specific WordPress plugins or themes.
  • Domain – this lets you know whether the request was to your WordPress site’s server or an external domain.
  • Size – this is the size of the file that was requested.
  • Timeline – this is how long the file took to load, as well as where the file loaded in the timeline of loading your page. Some files will be loaded at the beginning, while others will load at the end. This is the most complicated section because where a file loads is also important – it’s not just about how long it takes.

For a deeper look, GTmetrix has a really good “waterfall chart for beginners” guide.

By looking at the URLs, you can start to understand what’s happening on your WordPress site.

For example, if you enter “wp-content/plugins” in the search box, you can see HTTP requests that plugins have added to your site. Specifically, the Lightweight Social Fonts plugin adds a 22.9 KB font request for “fontello.woff” that took 337 ms:

The waterfall analysis shows http requests on WordPress

Similarly, you can switch to the themes folder to see the 4 requests from the GeneratePress theme, which is pretty dang low because GeneratePress is so well-optimized:

WordPress http requests

By going through these results, you can start to understand why your site loads the way it does and what trade-offs you’re making by using certain plugins and themes.

For example, is that plugin you’re looking at worth the extra 5 HTTP requests that take 500 ms? It might be if it’s essential…but it might not be if it’s something you could live without.

5 Tips to Reduce WordPress HTTP Requests

I think it’s helpful to dig into your own waterfall chart to understand what’s happening on your specific site, but to finish out this post, let’s talk about some generic tips that you can use to reduce HTTP requests on WordPress.

1. Limit Images When Possible

Each image on your site is an HTTP request, so every unnecessary image that you can cut out is one fewer HTTP request on your site.

If an image is necessary and helpful to your visitors, you’ll at least want to resize and compress it so that it takes up as little space as possible. You can do this with one of the many WordPress image compression plugins.

2. Combine CSS and JavaScript Files

Thanks to your theme and plugins, your WordPress site will probably have lots of different CSS and JavaScript files. Again, each separate file is one HTTP request, so finding a way to combine those files together can cut down on your site’s HTTP requests.

To do this, you can use a technique called file concatenation, which is often paired with minification (another way to reduce the size of your code files).

Many WordPress performance plugins can help you concatenate files, including WP Rocket (our review). Or, you can use Autoptimize as a dedicated minification/concatenation tool.

3. Don’t Let Plugins Load Sitewide If Not Needed

You’ll probably have plugins that you only use on a few pages on your site. For example, if you have a contact form plugin, you probably use it on your contact page and nowhere else.

However, some plugins will load their assets, like CSS and JavaScript, on every page on your site, even if the plugin’s content isn’t present. For example, Contact Form 7 loads its scripts sitewide.

Essentially, this means that some plugins will add 1+ HTTP requests to every single page on your site for no reason – not good!

If you absolutely must use a plugin that does that (rather than a more optimized alternative), you can use the Scripts Manager in the Perfmatters plugin to disable scripts on a page-by-page basis, which lets you force the plugin to only load its scripts on pages where you’re actively using it. Consequently, you can reduce HTTP requests on all the other pages on your site.

4. Remove/Replace Unoptimized Plugins

I’ve already covered the myth that using more plugins automatically means a slower-loading site.

However, using more unoptimized plugins will definitely slow down your site.

So, if you see a plugin with tons of slow-loading HTTP requests when you do your waterfall analysis, it’s worth thinking about whether or not you can:

  • Completely remove it from your site if that functionality isn’t necessary to the functioning of your site.
  • Replace it with a more lightweight option.

5. Consider Lazy Loading

Finally, to decrease the number of HTTP requests for a visitor’s initial page load, you can use lazy loading.

Lazy loading is a technique to delay loading certain “below-the-fold” assets (like images) until a user starts scrolling down.

Reduce WordPress HTTP Requests Today

In order for visitors’ browsers to load your site’s content, browsers need to send an HTTP request for every internal and external asset on your page.

All things equal, fewer HTTP requests generally means a faster-loading website, though you also need to factor in the size/time of each request.

To analyze the HTTP requests for your website, you can use the waterfall analysis feature in a WordPress performance testing tool like GTmetrix.

From there, you can follow the tips in this post to reduce the number of HTTP requests and speed up your site.

Any questions? Let us know in the comments!

Wp-dd.com

WordPress Design, WordPress Development, cPanel Hosting, Web Design, Web Development, Graphic Design, Mobile Development, Search Engine Optimization (SEO) and more.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.