Get NitroPack with up to 37% OFF
Once you start with NitroPack, you can freely choose your integration platform.
Everything you need to know about
NitroPack features and compatibilities.
Whether you run a blog or
an agency, we have a
partnership opportunity for you!
The place to learn how to
improve your web performance,
how to get the most out of
NitroPack, and what is coming
next to our product.
You just ran a Google PageSpeed Insights report, and this warning popped up in the diagnostics section:
Although “enormous” sounds scary initially, the “Avoid enormous network payloads” message is easily fixable.
In this guide, you’ll find the most effective techniques to root out the problem and make sure you never see the warning again.
Let’s dive straight in!
Much like a dialogue between two people, browsers and servers communicate through network requests and responses. So network payloads are the information a web browser and a server exchange when a user loads your website.
In a more technical sense, network payloads represent the total size of resources transferred over the network, such as HTML, CSS, JavaScript files, images, videos, and other content that makes up your website.
In simpler terms, “Avoid enormous network payloads” means your page size is too big. The reason the Google PSI report is bringing this to your attention is you’ve exceeded the recommended total page size of 1.6MB (or 1,600kB).
Remember!
In the case of this warning, you shouldn’t limit your optimization efforts to your home page only. All pages need to be monitored and their size reduced whenever feasible.
While there is no optimal page size, Google has found that the cap target of 1.6MB is the maximum amount of data that can be theoretically downloaded on a 3G connection while keeping Time to Interactive under 10 seconds.
The Google PSI test uses a 1.6 megabit connection (that's pretty slow), so realistically, to be competitive among audiences with access to fast networks, you’d want to aim for anything between 1-1.5MB.
This allows enough room for popular third-party services like Google Analytics, Facebook Pixel, and a good amount of images to be transferred without affecting your site speed in a bad way.
Which brings us to the next significant bit.
Large amounts of data transferred over the network negatively impact your website performance and visitors.
Large network payloads require more time to download, which hurts your:
Meanwhile, users and mobile users on slower networks and limited data plans are greeted with sluggish, frustrating user experience, unresponsive pages, and even denied access to your website. Not to mention, they might get charged extra by network providers for trying to load your website.
Unsurprisingly, this would mean your business will experience higher bounce and exit rates, decreased user engagement, and bad conversion rates.
Ultimately, not fixing the Avoid enormous network payloads warning will cost your online business and users real money.
Luckily, the PageSpeed Insights report allows a more granular look, so you can narrow down the culprits much faster before you begin troubleshooting.
Expanding the “Avoid enormous network payloads” warning will give you a detailed breakdown of the page weight by the type of files and where they are being served.
The most common culprits for large network payloads are:
Naturally, the next step is to explore which techniques and optimizations will help you reduce your webpage size most effectively.
Using a lightweight setup in the first place guarantees a reduced page size. Some WordPress themes and page builders (like Divi and Elementor) come with excessive features, customization options, and pre-loaded assets that can quickly bloat and slow down your website.
Consider testing their CSS, JavaScript, and fonts before developing your website. Also, check out which WordPress themes have shown great results on speed and Core Web Vitals performance.
If you already use a bloated theme or page builder, there are several ways to optimize them to reduce network payloads:
WordPress offers a great volume of functionalities through plugins.
However, using too many plugins, especially ones that generate dynamic content or load external resources, can increase the network payload. Each plugin may add extra CSS, JavaScript, or other assets to be loaded by the browser, resulting in a larger payload.
Here’s what you can do to prevent WordPress plugins from bloating your page size:
Minification involves removing unnecessary characters from CSS and JavaScript files, such as whitespace, comments, and line breaks. Eliminating these extraneous elements has an immediate effect on page size.
Once you’ve identified third-party culprits, it’s time you deprioritize them by loading them below the viewport to free up space in the main thread for more essential resources.
Reducing the impact of third-party code manually might feel too technical for some, and if this is your case, I suggest you opt-in for a ready-made solution. Turn to Flying Scripts for a specialized solution or a complete performance optimization plugin like NitroPack.
Uploading high-resolution images and videos directly to WordPress without optimization will result in large file sizes.
And what happens when you load large files on web pages? You guessed it. Increased network payload.
Here are several ways to optimize images:
Web fonts are often overlooked in resource optimization but are among the top assets that cause large network payloads.
Make sure you use fonts designed for the web space. You’ll recognize them by their .woff2 format. Also, hosting them locally will reduce the number of external requests.
Other effective font optimization techniques include:
A Content Delivery Network (CDN) is a network of servers distributed globally. Using a CDN, you can store copies of your website's static assets, such as images, CSS, JavaScript files, and other media, on servers in different geographical regions.
When visitors access your website, the CDN serves these assets from the server closest to their location, reducing the distance the data travels and minimizing network latency.
This results in faster content delivery and reduced network payloads. Additionally, a CDN can help handle traffic spikes and distribute the load across multiple servers, improving your website's overall performance and reliability.
A logical extension of using a CDN, you should take advantage of compression techniques like GZIP and Brotli. They can significantly reduce the size of your website's assets, including HTML, CSS, JavaScript, and other files.
In truth, Brotli is more flexible than GZIP, with a generally higher compression ratio. In fact, Squash Benchmarks tests conclude that Brotli provides a better compression ratio (meaning it produced smaller compressed files) across all compression levels.
Caching is a technique that stores frequently accessed data or assets in temporary storage to improve subsequent access times.
By implementing caching mechanisms, you can reduce the number of requests made to the server, minimizing network payloads.
There are different types of caching you can utilize:
The #1 takeaway for reducing large network payloads is to keep your website as lean as possible.
With NitroPack, you get 35+ automated optimizations, including:
Unlike other performance optimization plugins, NitroPack works on the cloud to eliminate website bloating and reduce the need for separate optimization plugins.
Run a demo test on your website to see NitroPack in action.
To make sure this warning never grazes your performance reports again, you should:
Lora has spent the last 8 years developing content strategies that drive better user experiences for SaaS companies in the CEE region. In collaboration with WordPress subject-matter experts and the 2024 Web Almanac, she helps site owners close the gap between web performance optimization and real-life business results.
