Page Speed on a Budget: The Optimizations That Matter Most

The optimizations that matter most

As a Core Web Vitals consultant I get a lot of different requests for pagespeed support. And yes, sometimes there is not a large budget. If that is the case I need to be even more efficient with my time and only perform high gain, low effort optimizations that actually move the Core Web Vitals.

Last reviewed by Arjen Karel on March 2026

The numbers make the case for you. According to the 2025 Web Almanac, only 48% of mobile origins pass all three Core Web Vitals. The median mobile page weighs 2.6 MB, with 632 KB of JavaScript (251 KB of which is unused). These are problems you can fix without a big budget.

Core Web Vitals TIP: My On-Call Consultancy is the most budget friendly way to get expert help. Book a 2-hour session (€300) and I will diagnose your Core Web Vitals issues, fix the most pressing problems, and give you a clear strategy for the rest. I prepare before we talk, so no time is wasted.

Book a session!

1. Figure out the issues first

When optimizing Web Performance on a budget we need to be absolutely sure that we are optimizing as effectively as possible. That means that first we need to know what the real problem is.

We can use the excellent free PageSpeed Insights to query the CrUX data. The CrUX data is the only data source that matters since that is the data source that Google uses.

Below the CrUX score you will see a Lighthouse audit.

Let me be clear about the Lighthouse audit! At this point in time we do not care about Lighthouse. Why? Because it does not measure the Core Web Vitals. Sure, Lighthouse is an awesome testing tool and feel free to explore all its suggestions but since we are on a budget we care about passing the Core Web Vitals. We do not care about passing synthetic tests right now!

Back to the CrUX data. Here are some guidelines to follow if you are on a budget. Start investigating the Core Web Vitals in this exact order and focus on these issues first!

• If you are failing the Time to First Byte fix that first!
• If you are failing the First Contentful Paint fix render blocking resources (defer scripts and optimize styles)
• If you are failing the Largest Contentful Paint prioritize resources that you need for that LCP (like fonts or images)
• If you are failing the CLS add width and height to all images, find and remove CSS transitions and reserve space for late rendering elements (like ads, product filters etc)
• If you are failing the Interaction to Next Paint you are most likely using too much JavaScript at the wrong time. Remove unneeded scripts and plugins, use a RUM tool like CoreDash to find the slowest scripts

2. Optimize your images

Images account for 911 KB of the median mobile page according to the 2025 Web Almanac. That is more than a third of total page weight. And 57% of LCP images are still served as JPG when WebP would be smaller at the same quality. On a budget, image optimization gives you the most impact for the least effort.

Convert images to WebP for free

There are lots of free tools, solutions and plugins available that will let you convert images to newer, faster and more modern formats like WebP. For WordPress for example I would suggest the excellent and free WebP Express.

Implement lazy loading

Lazy loading will signal to the browser that an image should not be loaded until it is nearly in the visible viewport. If you have 15 images on a page and only 3 are in the visible part of the page you can safely add loading="lazy" to the images that are not in the visible viewport.

There are 2 ways to address this. The first is to enable lazy loading in your CMS. This will add lazy loading to all images. Next consult the documentation on how to remove lazy loading for the images that are visible and important. The other way is to manually add loading="lazy" to below-the-fold images. For a complete guide, see how to defer offscreen images.

<img loading="lazy" src="image.jpg" width="800" height="600">

Set the image fetchpriority

By adding fetchpriority="high" to an image tag we signal to the browser that this image is more important than other images and should be downloaded first. And while there are better ways that include image preloading and 103 Early Hints, setting the fetchpriority is simple, fast and effective! Just identify the most important image on your page, edit the template and add fetchpriority="high" to the image:

<img fetchpriority="high" src="image.jpg" width="800" height="600">

3. Fix your browser caching

If you are using budget friendly hosting, chances are that the webserver is not configured optimally. One of the mistakes that I come across regularly is misconfigured browser caching. Without proper caching headers, returning visitors download the same images, scripts and stylesheets all over again. That is wasted bandwidth and wasted time.

If you are using Apache as a webserver, simply create a file called .htaccess in the root directory of your website and add these lines:

<FilesMatch "\.(ico|pdf|jpg|jpeg|png|webp|gif|css|js|woff|woff2)$">
  <IfModule mod_headers.c>
    Header set Cache-Control "max-age=172800, public, must-revalidate"
  </IfModule>
</FilesMatch>

While you are editing the .htaccess file, enable GZIP compression too. This compresses text-based resources (HTML, CSS, JavaScript) before sending them to the browser. On most sites this cuts transfer size by 60 to 80%.

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html text/css text/javascript
  AddOutputFilterByType DEFLATE application/javascript application/json
</IfModule>

If you are using a different webserver like NGINX please contact your hosting provider and point them to this article!

4. Consider Cloudflare (even the free plan helps)

Even on the free plan, Cloudflare gives you a lot of the important performance features. If you are on budget hosting, switching your DNS to Cloudflare is one of the highest impact, lowest effort changes you can make. For a detailed walkthrough, see the complete Cloudflare configuration guide.

On the free plan

1. Fast DNS. The Cloudflare DNS servers are free and will probably outperform the DNS servers of your budget hosting provider. CrUX data from the 2025 Web Almanac shows that only 44% of mobile origins have a good TTFB. Slow DNS is a common contributor, and switching to Cloudflare fixes that instantly.
2. HTTP/3 and Brotli. Cloudflare uses the newest protocols and the fastest compression methods. Without going into much detail, rest assured that this will speed up your network by at least 10%.
3. Consistent browser caching. Cloudflare has a strong record when it comes to caching static resources. The out-of-the-box configuration is probably better than what you have right now.
4. Edge caching for static resources. Cloudflare will cache versions of your static resources like images, scripts and CSS files and serve them directly to the end user from their edge network. This eliminates the need for round trips to your origin server.
5. Rocket Loader. Rocket Loader will defer the loading of scripts and handle the complications that arise from it. It is a crude method but if you are unable to defer scripts manually this will probably improve the paint metrics like Largest Contentful Paint. Note: Rocket Loader uses deprecated browser APIs and PageSpeed Insights may flag it. If you see those warnings, consider deferring your scripts manually instead.

On the Pro plan

One of the first things I always say when I see a free Cloudflare plan is "go pro!". If the $25 is something that you can afford and are willing to spend on a faster site you should probably consider it.

1. All the free features. Obviously the pro plan comes with all the free features.
2. Cloudflare APO for WordPress. APO for WordPress is a complete solution that will cache your pages on the edge network if visitors are not logged in. This can speed up the Time to First Byte enormously.
3. Lossless and lossy image optimization. One of the main advantages of using the pro version of Cloudflare is their image optimization. Cloudflare will convert and cache images in WebP format and serve them only to visitors who will accept these formats.

5. Self host as much as you can

Another simple and effective optimization is self hosting static resources. On many sites, static resources are hosted on external CDNs. For example jQuery is hosted on https://code.jquery.com/, Bootstrap is hosted on https://cdn.jsdelivr.net and your fonts are hosted on https://fonts.googleapis.com. I get the appeal. These CDNs present themselves as easy and fast but using them is actually a bad idea and will slow down your site.

The idea of using a shared CDN for these types of files was sound back when browsers could still share these files across websites. Those days are gone. The result is that a new visitor always needs to download the static file and it needs a new connection to a new server for each file. And these new connections to these new servers can take up a lot of extra time.

The solution is to self-host those third party files. Doing this is easy: just download the file, place it on your server and change the reference to this file. For fonts specifically, see how to self-host Google Fonts.

6. Defer your scripts

A huge bottleneck can be blocking scripts in the head of the page. These scripts can sometimes delay the loading of the page by up to 20 seconds! The 2025 Web Almanac found that only 15% of mobile pages pass the render-blocking resources audit. That tells you how widespread this problem is.

Deferring these scripts is not hard at all. Just add defer to the script tag and you are done. If you can, do this! Edit the template and change your script like this:

<!-- old blocking script tag -->
<script src="script.js"></script>

<!-- new deferred script tag -->
<script defer src="script.js"></script>

But there are catches! Adding defer to script tags can cause all sorts of issues and dependency errors. And since you are on a budget I have to assume you do not have the means to hire a JavaScript expert to fix all the issues that might occur. So please try to defer your scripts and check for errors (press Ctrl+Shift+I in Chrome and check the console tab). If there are no issues after testing you are one of the lucky few! If there are issues you should resort to one of the following solutions. For the full picture, see 16 methods to defer JavaScript.

Use Rocket Loader

As discussed, the free version of Cloudflare will give you access to Rocket Loader. This will defer all the scripts on a page. It is by no means perfect but most of the time it will do a pretty good job.

Use a plugin

Most CMS based sites have a huge plugin repository. There are many plugins out there that will let you defer JavaScript and handle all the complications that may come with deferring scripts.

7. Optimize your fonts

Web fonts are a hidden performance cost on budget sites. The median page loads 122 KB of font files according to the 2025 Web Almanac. If your fonts are loaded from Google Fonts, you are making extra DNS lookups and TCP connections on every first visit.

Two free fixes:

1. Self-host your fonts. Download the font files, place them on your own server, and load them from there. This eliminates the connection overhead to fonts.googleapis.com and fonts.gstatic.com.
2. Add font-display: swap. This tells the browser to show text in a fallback font immediately while the web font downloads. Your visitors see content faster and you avoid the invisible text problem. For the full strategy, see how to fix invisible text during webfont load.

8. Caching, caching, caching

When you are on a budget and do not want to spend a lot on hosting, caching is one of the most effective ways to speed up a website. Caching is especially effective against a high Time to First Byte. Caching can be done on different levels.

Client side cache: Configure your webserver to instruct browsers to cache as many static resources as possible. This will decrease load on your server. (See the .htaccess example in section 3.)

Object cache: Object cache can be used to store data that might be computationally expensive to regenerate, such as the result of complex database queries. Ask your hoster to install Redis or Memcached.

Full page cache: If you are using a CMS you would probably want to add a full page cache to your site. For WordPress, good options are WP Fastest Cache or WP Core Web Vitals.

9. Make strategic hosting choices

When it comes to hosting it pays off to shop around and the most expensive host is not always the fastest one. Generally you are looking for a hosting plan that is optimized for your CMS because a jack of all trades is a master of none. Look for hosting that includes PHP 8+, HTTP/2 and SSD storage as a minimum. A good WordPress host with those basics will outperform a generic shared host every time.

10. Monitor your performance

All these optimizations are worth nothing if you do not know whether they actually worked. Set up Real User Monitoring so you can see how real visitors experience your site, not just how Lighthouse scores it in a lab. Lab scores are useful for debugging, but field data from real visitors is what Google uses for ranking. CoreDash tracks the Core Web Vitals from real users and will tell you exactly where you stand.