A slow loading site can destroy the user experience and affect a person’s chance of buying from you. 70% of consumers say it determines whether they’ll even make a purchase. We’ve found many times; the solution involves making fewer HTTP requests.
But don’t worry, if your site can use a little speed, we’ll show you how to fix that based on 10+ years of running profitable online businesses.
How Do HTTP Requests Work?
An HTTP request is how web browsers and servers talk to each other. For example, every time you visit a web page, your browser (aka the ‘Client’) requests data from that site’s server so you can view it on your device.
This includes any HTML, CSS stylesheets, image files, or videos on that specific page. Once the server fetches the files, it sends them back to your browser.
Your browser has to wait for the server’s response with all the files to view the content properly. Some sites have many files, while others have few.
The number of files on the page determines the number of requests your server makes, one for each file. For example, if a web page has three audio files, your browser needs to make three separate HTTP requests.
The technical breakdown looks like this:
- Your browser (e.g., Chrome or Safari) sends a request to the web server
- That request is for all of the page’s content
- Once the server recognizes your browser’s request, it sends the files
- Your device (e.g., smartphone or desktop) starts rendering the files so you can view it
That’s a typical protocol for a single request to deliver content to your screen.
What Is HTTP?
HTTP (HyperText Transfer Protocol) is the primary way data gets distributed across the internet. It’s a set of rules defining how computer devices transfer information between each other. Because of HTTP, you can fetch everything from image files to JavaScript (JS) to text and audio.
So, if you’ve got amazing photos, witty text, or funny GIFs on your page, your browser will request all of those files to see the page.
Think about the number of elements on the pages you visit. Things including:
- Image files and GIFs
- CSS stylesheets that determine how your pages look
- Javascript files that add dynamic features to your posts
- WordPress plugins
What Are the Benefits of Reducing HTTP Requests?
A high number of HTTP requests can ruin the user experience because it causes your site to load slower. You can boost performance by reducing them and improving load times.
Fewer HTTP requests signal a more efficiently structured site that plays nice with other devices across the internet. It’s not a case of deleting content, as it is in ensuring it’s set up to run smoothly.
It means the likelihood of more people finding your content and sticking around once they do. This carries added monetary benefits, not to mention the possibility of more trials, leads, and conversions.
It’s also a positive SEO signal to search engines since Google said page speed is a ranking factor.
Decreases ad spending because you’ll see better results with improved dwell time. For example, if you’re spending
Still need convincing? Check out these stats:
- 70% of consumers say page speed determines if they’ll buy.
- In the U.S., mobile devices accounted for 79% of digital minutes. So there are more mobile users; however, mobile can take longer to load than desktops if you’re not optimizing for that demographic.
- Even a 0.1% change in page load time makes a difference.
Here’s what Google had to say:
The probability of bounce increases 32% as page load time goes from 1 second to 3 seconds.
Servers host a TON of data, and everything must be downloaded from them via HTTP requests.
So, you should focus on reducing:
-
- File size
- File download frequency (i.e., the number of requested files)
Website optimization is mandatory for any online business’s livelihood. So think hard before adding your next embedded video or stylesheet because each of those means another HTTP request to your web server from the user’s browser.
However, not all HTTP requests are equal, as we’ll soon see. When examining file size, smaller files will have less impact than larger ones. The larger the file, the longer your browser waits to get it.
For example, something that’s 20 kilobytes will load quicker than 5 megabytes.
Our Team Of Affiliate Marketing Experts Will Teach You How To:
- Outrank Bigger Sites
- Monetize Your Content
- Engage Your Audience
How to Locate Your Total Number of HTTP Requests
There are several page speed tools out there to test your overall website performance. We’ll continue using GTmetrix, but Pingdom and PageSpeed Insights are both popular platforms.
After entering your site’s URL into the empty field on the GTmetrix home page, scroll down to the “Page Details” section under “Total Page Requests.”
Click the Waterfall tab to see every individual request’s origin to examine further.
HTTP requests have different values and durations. Larger files require more time to download from the server. You can see an itemized list broken down by:
- URL
- Size
- Time
So, what’s a good number?
- Below 25 is excellent.
- Under 50 is healthy
- Around 70 is average.
HTTP requests are necessary to render your content to visitors. But you can take steps to ensure your site makes fewer of them.
How to Reduce the Number of HTTP Requests
Your two primary ways of reducing your number of HTTP requests are to remove the large files or combine them into a single file. Let’s examine a few options below.
#1. Get Rid of Bloated WordPress Plugins You No Longer Need
You can run your site through GTmetrix to determine how fast it loads. After it analyzes your URL, you’ll see the results.
To find the unnecessary plugins, select “Waterfall.” The Waterfall analysis shows your site’s HTTP requests. In the search field, type “plugins.”
This shows you anything uploaded to the wp-content/plugins folder.
Hover your cursor over the URL to see plugins by name. Next, review your inventory to determine how many requests each plugin makes.
Sidenote: You’ll only see the plugins that load files and make requests. Some don’t load anything, and that’s good.
#2. Find Lightweight Alternatives for Your Heavier Plugins
When you spot the plugins with large files and long load times, replace them with lightweight versions. If you’re debating between two brands, run a test by:
- Uploading each one to your site.
- Viewing the number of requests each plugin makes
- Picking the one with fewer HTTP requests.
For example, when I compare our affiliate marketing plugin, Lasso, to AAWP, I see AAWP has six requests.
These are small files totaling ~16 KB (90 KB when uncompressed). Then when I inspect Lasso, there’s only one.
It’s worth noticing these details when you’re making improvements.
Further Reading:
#3. Remove Unnecessary Photos
Have a look at the images across your site to see what you still use. Then, locate the unwanted photos and remove them.
In your WordPress Media Library, under “Bulk Actions,” choose “Delete Permanently” all of the unwanted culprits.
#4. Resize & Compress Your Existing Image Files
While optimizing images doesn’t technically reduce your site’s number of HTTP requests, it lowers their file size, improving page load time.
There are several online tools you can use to help reduce your image file sizes, for example, Tiny PNG or Optimizilla. Just upload your images, and it’ll compress them for you.
If using a plugin, Smush is a popular image optimizer. Alternatively, you can try Imagify (it’s what we use). It offers three levels of image compression and lets you bulk-optimize.
When resizing manually, Photoshop works well. In addition, you can try cropping specific images to make them smaller, decreasing their file size.
Image manipulation tools like ImageOptim focus on page speed and remove metadata.
Sidenote: Most images have metadata and may include phone or camera model, date, height, width, and geolocation. You can remove this unimportant info with a metadata removal tool.
#5. Minify CSS, HTML, and Javascript
Minification removes added characters, comments, line breaks, and whitespace in your site’s code. These attributes are unnecessary and can slow down your site the bulkier it gets.
Tools like Sublime Text can help you do this manually. It comes in handy and is one that we use. If you don’t want to attempt this yourself, find a good developer.
Alternatively, plugins like W3 Total Cache automatically execute this task for your WordPress site. Head to “Minify,” scroll to your JS minify settings (or CSS), and enable.
#6. Use of A Content Delivery Network (CDN)
A Content Delivery Network (CDN) uses a series of worldwide servers to deliver content based on your geographical location, so you get it quicker.
So instead of relying only on your site’s primary server with your hosting provider, CDNs fetch your page’s info from a data center that’s closest to each visitor.
CDNs let you leverage their massive infrastructure, reducing the load your primary web server gets by delivering cached copies of web pages.
This results in your physical server getting fewer visits.
Sidenote: Caching is when your browser temporarily stores web files to access them quicker. It also has the added benefit of lowering your CPU’s bandwidth.
We’re fans of Cloudflare, but there are several platforms you can try.
Further Reading:
#7. Combine CSS Files & JavaScript Files with A Caching Plugin
Chances are, your site has multiple stylesheets and JS files to run smoothly and look good for your audience. But too many files can cause delays and mean multiple HTTP requests.
So, you can combine them into a single file to lower your number (e.g., multiple stylesheets into one stylesheet). This process (aka ‘concatenation‘) allows you to reduce the number of HTTP requests taken by your site.
We use WP Rocket to accomplish this.
It’s pretty straightforward: tick the box in the “File Optimization” tab titled “Combine CSS files (or ‘Combine JS files‘ if you want to combine JavaScript files).
Caching plugins make it super simple if you’re not a developer and don’t want to do this manually.
#8. Use Image Lazy Loading
Lazy loading delays loading your site’s image files until their needed versus all at once. So your site only loads content in the above-the-fold section when a visitor browses your site.
Takeaway: Images get loaded as your visitor scrolls down. So the material found at the bottom won’t load until your reader gets there, improving your load time.
You can try using a free plugin like Autoptimize. You can enable lazy-load images by ticking a box in Settings > Images.
Images account for more than 60% of the bytes required to load a web page. So, it’s vital to optimize them to reduce lag and boost speed.
#9. Eliminate Render-Blocking Resources
Render-blocking delays the load time of a page so your visitors are unable to see all of the crucial above-the-fold (ATF) info upon arrival. This is particularly common with JavaScript files.
When you land on a web page, your browser parses the site’s code from top to bottom – much like how you read a book.
The problem occurs when you have a JavaScript file at the top of your site’s HTML; it blocks the page from rendering until the .js file downloads. This happens with every script found within your site’s code.
Image source: GTmetrix
So, your reader is trying to view content at the top of the page while your browser is busy loading a JS file for material located at the bottom.
Your backend influences how people perceive your front-end resulting in people thinking your site’s slow. You can read this guide on how to eliminate render-blocking resources on your WordPress site.
#10. Reduce Third-Party HTTP Requests
Third-party (or external scripts) negatively impact your site’s load times. Therefore, you’ll want to ensure you’re doing everything you can to minimize their effects.
You can run your site through GTmetrix to see its third-party requests in the “Structure” tab.
Scroll down to the “Reduce the impact of third-party code.” Here’s what I see when running our personal finance site through:
The impact on our site is non-existent.
Any domain different from yours that serves elements to your site is a third-party. These external scripts increase the number of requests your browser handles and delay it from performing other tasks.
Examples could be Google tags (e.g., Google Analytics or Google Fonts), Facebook pixels, YouTube videos, social sharing plugins, and ad services.
You can also see your site’s third-party HTTP requests using your browser’s dev tools. For example, using Chrome, go to the top menu bar, select View > Developer > Inspect Elements.
A sidebar opens on your viewport’s right side. At the top, click “Network.” Then tick the box titled “3rd-party requests.”
You can see this page has a high number of requests (916 of them!) due to its ad volume.
Sidenote: Ads take information about you and your computer and run a continual real-time bidding campaign and fill ad inventory based on that. As long as your browser tab stays open, it’ll continue to consume both CPU and bandwidth.
#11. Consolidate Images into CSS Sprites
A CSS sprite is a single image file containing multiple images. The idea behind doing this is that it’ll combine all of your images into an HTML document for easy access while decreasing requests.
There’s no plugin option for this, but you can use a CSS sprite generator tool like this one or this one.
One caveat: Use only images appearing sitewide (e.g., icons or logos). Don’t use material from individual blog posts or ones appearing a couple of times. Why?
Because you can’t rank images in a Google search found in CSS sprites, nor can you add alt text to them (for those using screen readers), which can negatively affect SEO.
If using a sprite tool, it’s a straightforward process:
- Upload images to the CSS sprite tool
- You’ll get a single image file for all of the images
- Copy the code generated from the CSS sprite builder and paste it into your site’s CSS script.
This article goes into greater detail on ways to handle CSS sprites.
The Plugins We Use for Speed
We use three primary plugins to keep our site fast. These are simple to configure in your WordPress dashboard and should help you provide an excellent user experience.
If you want serious speed that just works, this is what you've been looking for. Their performance and bang-for-your-buck are unparalleled. They also deliver a ton of value on their free tier.
Make your site load faster in a few clicks. WP Rocket is recognized as one of the most powerful caching plugins for WordPress. We use it specifically for image lazy loading.
Imagify speeds up your website with image compression, so your pages load faster. Instead of taking the time to format your images, they optimize them automatically.
We use this Lasso Grid display above to showcase our favorite tools and build our site’s Resources page. Our product displays convert better, are SEO-friendly, and are ultra-lean.
Fast sites make more
money , so we use Lasso to display helpful content to our readers while increasing our revenue in the process.
If you’re looking for a lightweight theme to go one step further with, check out Carbonate, created by Lasso co-founder Matt Gio.
Further Reading:
Revisiting our ads example from earlier with the insanely high number of HTTP requests.
When using ads, consider the impact they’ll have on your site. If they’re providing a poor UX for readers, this signals to search engines that there’s little value there (e.g., they bounce).
Generally, these value in the single-digit dollars per 1k visits. So a $9 CPM on 100k visits (huge site) is only $900.
On the other hand, affiliate income is a multiple of that because you assume the risk of converting instead of the advertiser. Our sites do an $80 CPM equivalent (if our sites ran ads).
Takeaway: Our sites earn more revenue from affiliate income. Putting up ads can crush affiliate conversion rates because they’re competing for your visitor’s attention in the form of CTAs and clicks.
The Difference Between HTTP and HTTPS
HTTPS (HyperText Transfer Protocol Secure) encrypts your HTTP request from attacks. When you transfer data across the web without safely securing it, it’s vulnerable.
In short, it protects the communication between servers and browsers. Every site using HTTPS can be identified by its padlock in the address bar.
Getting HTTPS is free with most hosting providers. To ensure your data is protected, you’ll need to get a TLS certificate (aka SSL certificate).
This also improves trust, confidentiality, and SEO (albeit it’s a small ranking factor). For example, landing on a page without an SSL cert greets me with this:
How likely are you to stick around on an insecure site? Me, not very. This can negatively affect your bounce rate and dwell time (both SEO factors).
Last Words
Once you know how fast your site loads, you can take action. The likely culprit often boils down to the number of HTTP requests it makes. I hope you’ll walk away with a better understanding of performing routine maintenance across your site to keep it performing at an optimal level.
Do you want to see how else Lasso can help amplify your income? Have a look here.
Our creations in your inbox, weekly.
We've built multiple six-figure online businesses that our moms are proud of.
We'd like to help you do the same.