If you have a website, you need to care about site speed optimization.
Page speed has a huge effect on your site’s user experience – there’s all kinds of data linking slow site speed to higher bounce rates, lower conversion rates, and just generally unsatisfied users.
But honestly, you don’t really need data to prove this point because you probably already know how incredibly annoying a slow-loading website is, right?
What’s more, with Google’s new Page Experience update, Google also uses Core Web Vitals metrics like Largest Contentful Paint as a search engine ranking factor, so slow page speed can also be a drag on your site’s search engine optimization.
So – site speed is important…but it’s also complicated.
There’s caching, JavaScript optimization, CSS optimization, HTML optimization, content delivery networks (CDN), image optimization, prefetching, compression…you get the idea.
NitroPack is an easy-to-use plugin that helps you implement pretty much every single performance optimization tactic that your site needs in one tool.
On WordPress, all you do is install the NitroPack plugin, click a few buttons, and your site will instantly benefit from tactics such as caching, a content delivery network (CDN), CSS/JavaScript optimization, and much more.
In our hands-on NitroPack review, we’re going to take a hands-on look at this tool including the following:
- A quick rundown of the features
- A NitroPack tutorial and look at the interface
- Thoughts on whether NitroPack’s improvements are “real” (this will make sense later on)
- Some before/after performance tests with NitroPack
- Pricing
- Final thoughts
NitroPack Review: What Does It Do?
NitroPack is an all-in-one speed optimization plugin for WordPress (and some other platforms).
That’s one of the most unique things about NitroPack – it really is all in one.
This is surprisingly rare. For example, WP Rocket is a very comprehensive page speed plugin in its own right, but you still need to at least pair it with an image optimization solution, a CDN, and some other tweaks.
With NitroPack, there’s no need to build a “stack” of performance optimization tools. It just does everything for you. Here are the high-level features that it covers:
- Caching – including smart page caching with preloading and smart cache clearing as well as browser caching.
- CDN – a built-in CDN with 70+ global endpoints, Gzip/Brotli compression, and more.
- CSS optimization – including handling above-the-fold critical CSS so that you can boost your initial load times, including the Largest Contentful Paint metric.
- JavaScript optimization – you can defer scripts to improve initial load times and otherwise optimize all of your site’s JavaScript. NitroPack also has a unique way of moving scripts off the main CPU thread and delaying scripts until user interaction – more on this below.
- Image optimization – it can automatically compress/resize images and convert them to WebP. There’s also a new adaptive sizing feature that lets you dynamically serve different images to users based on their screen sizes.
- HTML optimization – including advanced details like DNS preconnect for key resources.
This image does a pretty good job of summing up the key features:
One unique thing about NitroPack is its “proprietary resource loader”. The concept/benefit of this is pretty complex, but the basic idea is that NitroPack optimizes how your site loads (especially its JavaScript) to make all the separate files load in an optimal way for user experience.
Basically, if you enable this feature, it tries to only load the minimum files needed to render the above-the-fold content and then wait to load the rest until a user starts interacting with your site. By doing this, you can greatly speed up the initial load time of your site, including the Largest Contentful Paint metric.
You can read all about this here.
How to Use NitroPack
Beyond NitroPack’s comprehensive site speed optimization features, its easy setup is another one of its strongest benefits.
You can literally be up and running with a fully optimized site in just a few minutes thanks to multiple preset optimization modes.
Let’s look at how it works…
1. Add Your Website
To begin, you’ll want to add your website via the NitroPack dashboard:
Then, you can connect your NitroPack account to your site using a connector tool. For WordPress, that means the dedicated NitroPack plugin at WordPress.org:
2. Choose Your Optimization Mode
Now, you’re ready to choose your optimization mode. This is one of my favorite parts of NitroPack because it’s what makes NitroPack so simple.
Rather than tinkering with a bunch of separate settings like you’d need to do in most plugins, NitroPack just lets you choose a preset configuration based on your needs. For more advanced users, you still can tinker, though.
You can select this from your WordPress dashboard or the NitroPack dashboard.
There are five different modes, but I think most people will want to choose Strong as it offers a good balance of performance improvements while still preserving your site’s functioning.
Many people also like Ludicrous mode as it will make the biggest improvement to your PageSpeed scores and Core Web Vitals. However, I recommend being careful with this mode as the way that it delays JavaScript might interfere with certain functions on your site.
For example, if your mobile menu relies on JavaScript, Ludicrous mode might cause some weird behavior there. On the other hand, if you have CSS-based menus, that might not be an issue.
So – feel free to play around with Ludicrous mode to start, but be prepared to scale back to Strong mode if you experience any issues:
3. …Profit
For many users, this is literally it. Once you choose your configuration mode, you can stop thinking about performance because NitroPack handles the rest.
4. …Or Tinker (For Advanced Users)
For more advanced users, NitroPack also gives you lots of options to tinker. You can exclude certain pages, scripts, cookies, resources, query parameters, and so on.
You also get some neat options, such as the ability to optimize ad scripts, clear the cache by webhook (combine this with WP Webhooks for some fun), and perform some other advanced actions:
If you’re a casual user, feel free to ignore all of this stuff. But if you’re an advanced user, you’ll probably appreciate these settings.
These settings can also help you use Ludicrous mode without issues because you can exclude certain scripts that you don’t want to delay loading.
NitroPack and “Blackhat SEO” – Is That a Real Thing?
If you’ve searched around for other NitroPack reviews, you might’ve seen the accusation that NitroPack is a “blackhat SEO” tool that tricks Google into thinking your site loads quickly even though it really doesn’t.
So – what’s the deal here?
Well, the answer gets pretty technical but I think it’s pretty clear that NitroPack isn’t doing anything bad.
The main issue here seems to be the difference between lab speed test data and real “field” speed test data:
- Lab Data (Synthetic) – simulated performance data collected by a speed test tool.
- Field Data – your site’s real performance data as experienced by real human visitors. Typically, you’ll collect this via the Chrome User Experience Report, which is available in PageSpeed Insights if your site has enough traffic.
Field data is what really matters for real-world performance (and for Google’s Page Experience SEO algorithm update), but most people focus too much on lab data and “scores” instead because they’re way easier to collect.
The way that NitroPack’s proprietary resource loader works in Ludicrous mode by moving certain processes off the main thread and delaying JavaScript execution means that your site will look “abnormally” good in some lab speed test tools (because many tools aren’t able to detect the off-thread processes).
And I do kind of get what people are saying here – a site using NitroPack and Ludicrous mode will look “suspiciously” good in certain speed test tools.
However, the real issue here is whether you think NitroPack is doing this maliciously to “cheat” Google or if it’s just a natural by-product of the way their resource loader works and optimizes your site.
Personally, I think it’s pretty clear that NitroPack is the real deal and this is more an issue with the way some speed test tools work rather than with NitroPack trying to game the system.
Here’s why:
First off, NitroPack isn’t trying to hide anything here because they themselves recommend NitroPack users look at the real user performance data rather than just relying on lab data.
What’s more, NitroPack is working to put real field data front and center in the NitroPack dashboard. If you look at the real field data, you’ll see that NitroPack makes big improvements to both the lab data and the real field data.
You can’t fool the real-world data. So if NitroPack were really trying to pull a fast one on people, it wouldn’t be smart of them to encourage their users to focus on real-world data over lab data.
The last allegation is that NitroPack is doing some type of black hat SEO that Google will eventually penalize.
Honestly, this makes no sense to me.
First off, page speed is still a small ranking factor, so it’s not like “tricking” Google into thinking you have a fast site will shoot you up the rankings. Google has said that site speed is more of a “tiebreaker” between equally relevant sites, rather than something that will improve your rankings by itself.
That is, it’s not like having your site go from two seconds to one second will change anything – two seconds is already fast enough to win Google’s tiebreaker.
Beyond that, I think the SEO allegations just don’t make sense because of how many popular sites are using NitroPack and still ranking well.
In fact, we use NitroPack here at WP Mayor! We wouldn’t be doing that if we thought there were any negative impacts on SEO.
If you want to verify this, you can look at the headers for WP Mayor and you’ll see that we are indeed using NitroPack:
Finally, if you’re really worried, you can use the URL Inspection tool in Google Search Console to see how your site looks with NitroPack when Google crawls it. If you do that, you’ll see that Google detects your page’s full content just like it would without NitroPack.
That is, there’s zero difference in your site’s content to Google’s eyes according to Google’s own crawl tool.
NitroPack Performance Before/After
With that lengthy discussion out of the way, I do want to look at some performance data from WP Mayor.
Despite what I said above about field data being more important than lab data, I am going to use a synthetic speed test tool here because, well, it’s hard for me to collect before/after data with real user load times.
However, I’ll use WebPageTest, which does a better-than-average job at capturing the full page speed experience because it shows both fully loaded and document complete metrics.
The fully loaded metric will capture a lot of the JavaScript that NitroPack defers/delays on the initial load.
Because we live in a mobile-first world, I configured WebPageTest with a mobile-first approach:
- Test from an emulated iPhone 8
- Use a throttled LTE connection
- Run nine separate tests and take the median value
Here’s the data for the WP Mayor homepage with and without NitroPack:
Before NitroPack ๐ข | With NitroPack ๐ | |
Time to first byte | 0.722 s | 0.742 s |
Largest Contentful Paint | 2.123 s | 0.970 s |
Cumulative Layout Shift | 0.006 | 0 |
Total Blocking Time * | 0.174 s | 0.033 s |
Document Complete Time | 3.063 s | 1.598 s |
Document Complete HTTP Requests | 88 | 9 ** |
Document Complete Size | 1.45 MB | 0.48 MB |
Fully Loaded Time | 3.161 s | 2.457 s |
Fully Loaded HTTP Requests | 89 | 46 |
Fully Loaded Size | 1.45 MB | 0.85 MB |
*This is a good proxy for First Input Delay, which is only available from field data.
**You can see that the HTTP requests are really low at first because NitroPack is delaying a lot of these scripts.
Overall, you can see a pretty massive improvement across the board with NitroPack, especially when it comes to Largest Contentful Paint and the Document Complete metrics.
Keep in mind that you can achieve these improvements with just a few clicks. Again, I think what makes NitroPack unique is the combination of performance improvements and simplicity.
If you’re interested in PageSpeed Insights scores (personally, I’m not), I also collected those for the WP Mayor homepage with and without NitroPack:
Before NitroPack ๐ข | With NitroPack ๐ | |
Mobile Score | 38 | 80 |
Desktop | 88 | 96 |
You can see huge improvements there as well, especially with the mobile score.
NitroPack Pricing
Now that we’ve covered everything else, let’s talk about NitroPack pricing.
First off, NitroPack does have a free plan that supports up to 5,000 visitors per month and 1 GB CDN bandwidth with all features. If you have a low-traffic site, that free plan might work fine for you, at least at the beginning.
However, the downside of the free plan is that it includes a NitroPack badge in your site’s footer. It’s not very intrusive, but it is something to keep in mind.
If you exceed the free limits or you just want to remove the NitroPack badge, you’ll need to pay for a plan. NitroPack’s paid plans allow both monthly and annual billing. If you pay annually, you’ll get two months free.
All of the plans have the same features – the only differences are the page view limits and CDN bandwidth. Additionally, each plan only supports a single site. If you have a lot of sites, you can reach out to NitroPack’s sales team to learn about custom agency and multi-site plan options, which can save you some money.
If your site has more than one million page views or consumes more than 500 GB CDN bandwidth, you can also reach out to NitroPack sales for a custom plan.
Additionally, all plans come with a 14-day money-back guarantee, so you aren’t risking anything.
Final Thoughts on NitroPack
Overall, I think that there are some definite pros and cons to using NitroPack to speed up your website.
The main advantages of NitroPack are that it’s so simple and so comprehensive. It’s one tool that implements pretty much every performance optimization tactic, including unique approaches like the way it delays JavaScript and moves it off the main CPU thread. I don’t think you’ll find a simpler way to go from zero to having a fully optimized site.
For a lot of people, especially non-technical people, that’s a really powerful value proposition.
The main disadvantage of NitroPack is that it’s expensive, at least for the WordPress space. If you’re on a budget, you can find cheaper site speed plugins to optimize your site (like WP Rocket) or you could even build a pretty good optimization stack using entirely free WordPress plugins.
In the end, it kind of comes down to this…
Site speed is incredibly important, so you can’t just ignore it.
When it comes to what you do about site speed, you need to answer this question:
Are you willing to pay a slight premium for pretty much a one-click solution to solve your site’s speed issues?
If you’re not a very technical person or if you’d rather focus on creating content and marketing your site instead of performance optimization, I think you might fit into the “Yes” category.
On the other hand, if you want to keep your costs as low as possible, you might fit into the “No” category, in which case you might prefer a cheaper or free WordPress page speed plugin.
Are those plugins as simple as NitroPack? Not really. But if you’re willing to put in the work, you can still build a fast-loading website using free or cheaper tools.
If you’re on the fence, I recommend just signing up for NitroPack and running some tests. The setup process only takes a few minutes, so you won’t need to invest much time.
Beyond that, there’s a 14-day money-back guarantee, so you’re not risking any money either (or, you could just try the free plan if you’re ok with the NitroPack badge).
0 comments:
Post a Comment