Configure LiteSpeed Cache Plugin to Fix Core Web Vitals Errors

How much is your website fast? Does your Website meet with one of the Google ranking factors Core Web Vitals?

We're your Core Web Vitals Developers!

Table of Contents

We will fix the core web vitals issue on reported URL's then submit them until they are in the 'Green' section..

View Service!

If you are using the Litespeed cache WordPress plugin on your website, then your website can be much Faster. And Core Web Vitals errors free.

LiteSpeed ​​works effectively on both WordPress sites and Joomla. As if that were not enough, it natively provides us with additional protection against DDoS attacks. It is versatile on sites large and small alike, with traffic of millions of entries or modest visits.

We will Configure Litespeed Cache to Fix Core Web Vitals errors on a website called Blogginguidez.com and see the Live results. Everything will be practical.

So let’s check the PageSpeed Insights report for this website to check website speed and Core Web Vitals errors.

Here’s the result:

And in this article, we are going to teach you how to configure Litespeed Cache Plugin to fix Core Web Vitals errors. And get the most out of it so that your site is even faster, both in a quick guide (but 100% effective).

How to Configure Litespeed Cache to fix Core Web Vitals Errors

Below we point out step by step how to configure the LiteSpeed ​​Cache plugin for WordPress accompanied by screenshots.

If Litespeed is not installed on our site yet, that’s the first thing we need to do. It’s free.

If you already have it installed, please go to Litespeed ‘Cache‘ settings as shown in the screenshot.

LiteSpeed Cache Settings

Cache

In the Cache configuration section:

•  Enable cache: ON. Without this, we are blown away.
• Cache logged-in users: OFF. (only enable if our site (1) has few users logged in at the same time AND (2) these users browse different content AND (3) are regular visitors to our site. Otherwise, LiteSpeed ​​would create a cache for little or no private pages visited).
• Cache Commenters – A feature that doesn’t add much. Better to leave it OFF.
• Cache REST API: The same as in the previous case; In general, it will not contribute much but in any case, we will leave it ON just in case. Check, after activating and accepting the changes, that the site works normally.
• Cache login page: since malicious robots that browse the internet looking for security holes often attack login pages, it is best to leave this option ON. Only deactivate if this page presents anomalies in the design, in some function, or the captcha. 
• Special note: many administrators move the / wp-admin or / wp-login URL to a different URL. If you do that LiteSpeed ​​won’t be able to protect your login page …
• Cache Favicon.ico: ON.
• Cache PHP resources: ON. This function is especially useful for themes and plugins with poorly debugged code and/or programming errors.
• Mobile Cache: OFF unless your site has an AMP version or specific design/content for mobile devices (Important note: responsive design is NOT the same as having deferred content for mobile devices; therefore, in this case, it will also be OFF ).
• List of mobile User Agents: only use when the previous option is also ON (AMP cases or deferred design for mobiles such as those supported by Elementor and Astra 3.0). This list allows you to add more devices if you see fit.
• Privately cached URIs: It is for pages that need to be cached separately for each visitor (assuming each visit browses different content). The number one example of this is user profile pages, but caching for this is not critical when there are few logins on a site. On the other hand, we can assume that a client and/or loyal user will be indifferent to the milliseconds of loading at the beginning of the session.
• Force cache URLs: the pages in this list will have their version cached yes or yes (regardless of other global settings or rules where there are exceptions).
• Force public cache URIs: similar to above; The URLs in this list will be forcibly cached in the public cache regardless of any “non-cacheable” settings that may have been configured elsewhere.
• Drop query strings: extremely useful to avoid cache generation for certain query strings. Eg: some query strings do NOT change the content, unlike those that change the language or a currency. Typical query strings that do not modify the content and therefore should be listed here are those that incorporate trackers such as Facebook, Google, and cookies. We recommend that these three lines be listed: fbclid, gclid, utm *, _ga.

Now, hit the Save Changes button.

TTL Cache

Ignore all options as follows:

• Public cache default TTL: do not touch.
• Private cache default TTL: do not touch.
• Default TTL of Main Page: do not touch.
• Feed default TTL: do not touch.
• REST default TTL: do not touch.
• TTL of the default page status code: do not touch.

Purge Settings

Purge all on upgrade: ON it. And leave all the options.

Exclude Settings

These options are rarely useful on common sites. The useful thing here is to be able to exclude certain pages from the cache (the rest of the functions are usually used for measurements and diagnostics).

• Do not cache URIs: to exclude pages from the cache. (We recommend listing here pages that have contact forms, pages that users see when they log in, and payment pages, although concerning WooCommerce the payment page is excluded by default).
• Do not cache Query strings: exclude certain query strings from the cache (useful for certain cases where a query string updates the content frequently).
• Do not cache Categories: easy, here you can list categories of content/products that for some reason you do not want to be part of the cache.
• Do not cache Tags: same as the previous item but for content tags.
• Do not cache Cookies: exclude certain cookies.
• Do not cache User-Agents: list here user agents that you do not want to cache.
• Do not cache profiles: Exclude specific user roles from cache. There is no need to check anything unless you are caching private/logged-in user pages.

ESI Settings

Thanks to ESI (Edge Side Includes), pages can be served from the cache to users with started sessions. ESI’s advanced function allows us to cache dynamic pages that should not normally be cached. It is a configuration that is done on the server-side by ITs, but that Litespeed nevertheless enables.

It is possible to convert any function, content, and widget to ESI, which will allow you to decide specifically how to cache it: privately, publicly with your own TTL (useful for shorter TTL content), or not to cache it at all (that is, respect the dynamic gestation).

Recommended with exceptions: There are still some bugs that can occur with functions that are based on their specific triggers and JS. Test at discretion.

• Enable ESI: only turn it ON
• Cache admin bar: ON.
• Cache comment form: ON.
• ESI Nonces: so that certain plugins that use nonce security features do not have problems with private cache.
• Vary Groups: Do not change this setting unless you fully understand what it works for.

Cache Object

This is a cache that normally we will not find enabled from the server unless it allows it.

• Object cache: ON. If the server has Redis installed or Memcache is activated or the database of your site has a huge amount of daily requests (eg: a store with 10,000 visitors per day).
•  Method: if it exists, Redis is preferable.

• Host: must be localhost unless you have another address. Method: if it exists, Redis is preferable to Memcache.
• Port: do not touch this number unless you configure an alternative port.
• Default Object Lifetime: 360 seconds is the safest. Only increase this value if you notice that the dynamic content on your site is not updating fast enough.
• Username: only for administrators using the version of Memcache SASL.
• Password: you rarely have to enter something as it is not used in these cases.
• Redis Database ID: Do not touch unless you intend to use a different database ID in scenarios where the Redis database is congested.
• Global groups: it is not necessary to touch anything (in any case items could be added).
• Groups not to be searched: it is not necessary to touch anything (in any case items could be added).
• Persistent connection: ON.
• Cache wp-admin: OFF unless object cache is being used to speed up the backend. In general, when the WordPress Dashboard is slow it is a sign of few resources/low quality of the contracted server.
• Store transient data: ON.

Browser cache

This is the same function that those lines of code that mention expiry ( expiry ) found in the .htaccess file in the root of the site fulfill (some plugins also perform this function).

We remind you that this function allows a browser to use its cache already created on a computer or mobile device in a previous visit by the user (a recurring user would browse the files already downloaded on their device rather than download all the information again).

• Browser cache: ON.
• TTL browser cache: we recommend a number between 2592000 seconds (which is 30 days) and 31557600 (which is 1 year).

Advanced Cache

Although these settings are intended exclusively for advanced users (read people already familiar with the internal workings of a server), we are going to explain each item.

• Login cookie: it is only necessary to complete it if you have several sites that share the same domain name (one in a subdirectory). Entering a unique identifier is required so that LiteSpeed ​​does not mix visits from one side to the other.
• Improve HTTP / HTTPS compatibility: It must be OFF and, on the other hand, your site should only enter through one protocol (eg: HTTP must redirect to HTTPS when there is an SSL certificate). If you can enter your site by typing both HTTP and HTTPS without redirection, in addition to being a serious security problem, write us in the comments so we can help you.
• Instant click: OFF. Enabling it means that a page begins to download in the background when a user hovers the mouse cursor over the corresponding link (that is, they do not have to click for the load to start). You can do tests and see how it turns out (taking into account that you are going to increase the use of your hosting resources because it is enough for the mouse to slide over links/buttons so that the sections where they go are downloaded, regardless of the user going to actually enter or not).

Note: this feature can be inconvenient for shopping carts. It can also create conflict with cookie tracking when there are ads or affiliate links.

CDN

CDN Settings

These settings make sense when your site works in conjunction with a CDN service like Cloudflare.

• QUIC.cloud CDN: ON. Quic.cloud provides features such as HTML caching on the CDN itself (useful when your server is slow and/or does not provide LiteSpeed ​​from the server), image compression (if you want to use LiteSpeed ​​compression instead of ShortPixel or others), generate critical CSS (not recommended), CDN for static assets (if you don’t use another CDN service like Cloudflare). You can learn more about Quic.cloud here.
• Use CDN mapping: ON if you use a CDN other than Cloudflare or Quic. cloud.
• CDN URL: enter the web address of the CDN along with the types of files to include. You can add multiple CDNs (for example, if you use one service for images and a different one for videos). If multiple CDNs are used for the same assets, the service will be chosen randomly.
• HTML attribute to replace: it is not necessary to touch anything (in any case items could be added).
• Original URLs: do not touch unless your site spans multiple URLs, as in the case of multiple sites or sites in multiple languages, where multiple domains or subdomains are used.
• Directories included: the values ​​that come from the factory are usually sufficient, but if it is necessary for your site you can include others.
• Exclude path: to exclude any directory that is in the list of directories included in the previous field.
• Cloudflare API – For Cloudflare users only. Enter your email, global API key, and domain here so that LiteSpeed ​​flushes Cloudflare’s cache at the same time it flushes its own.

Manage CDN

To activate these features you must have the Cloudflare API active in the CDN configuration.

• Cloudflare: You don’t need to touch anything.
• Development mode: you can turn on this mode when you make design and content changes to your site (useful so that the changes are reflected without delay).
• Cloudflare cache: allows you to only clear the Cloudflare cache but not the LiteSpeed ​​cache (useful when changing images or other elements that you need to see reflected on the site on the spot).

Image Optimization

Image Optimization Settings

• Auto request Cron: ON if you want your site to automatically request optimization of all newly uploaded images.
• Auto Pull Cron: ON if you want to automatically download optimized images to your site.
• Optimize original images: ON. A copy of the images will always be saved before compression.
• Remove original backups: OFF unless you need space on the server or you are 100% satisfied with the compression and appearance of the images resulting from LiteSpeed ​​compression.
• Optimize Losslessly: This is a NON-destructive compression method The images look better but they weigh more, and therefore it is not the most used method on the planet.
• Preserve EXIF ​/XMP data: OFF, unless you need your site to display that information (for example, on sites dedicated to photography).
• Create WebP versions: ON. We fully explain the new image compression formats here.
• Image WebP Replacment: ON.
• WebP attribute to replace: the way to control which images will be replaced by the WebP format. It is a way to save space on the server by using WebP for certain images only (eg: large images, or images that use transparency).
• WebP for extra srcset: the way to enable WebP format for images not managed natively with WordPress.
• WordPress Image Quality Control: Default is 82 and this is a good standard compression. It can be modified to test and find the best compression based on the complexity/simplicity of images on our site.

Page Optimization

Page Optimization – CSS Settings

Here let’s take some time to entertain ourselves since there are several functions available. However, we recommend testing each option individually because if something breaks on the site it is most likely that the problem is generated here.

The vast majority should not activate minification or combination through LiteSpeed ​​because they are processes that slow down the server (it is much better to do it from Cloudflare occupying other people’s resources). Otherwise, combining all the CSS and/or JS can cause problems without really improving the speed of a site much.

With these points clarified, we are going to unravel each available function.

• Minify CSS: OFF (use Cloudflare minification). If it is set to ON, refresh the page and check that everything works correctly.
• CSS Combine: OFF as a precaution. If it is set to ON, refresh the site and check its normal development.
• CSS Combine external and inline: Includes external CSS and embedded CSS in a combined file as long as Combine CSS is also enabled. This option helps maintain CSS priorities by minimizing potential errors caused by combining CSS.
• Load CSS asynchronously: leave it OFF; activating it will help your score in Pingdom / GTmetrix but it will harm the user experience (and today Google places great importance on this.)
• Inline CSS Async lib: OFF. Authentic CSS always blocks content and that is being addressed by Google’s new measurement guidelines.
• Font display optimization: from a user interface point of view, we recommend using ‘Default’. Never enable ‘swap or ‘fallback’ because you will have text style flickering issues while loading.

Page Optimization – JS Settings

• JS Minify: ON (use Cloudflare minification).
• JS Combine: OFF is more secure; if it is set to ON, carry out meticulous tests of all the functionalities of your site.
• JS Combine external and inline: if the previous item is activated, we recommend that you activate this one as well: it helps to maintain the JS execution priorities that should correct the potential errors caused by the JS combination.
• Load JS DEFERRED: OFF is more secure. Some JS is used for critical items above the ‘fold’ and therefore should not be deferred.

Page optimization – Optimization

• Minify HTML: OFF (take advantage of this by activating it in Cloudflare).
• Prefetch DNS: A good strategy for speed is to preload the DNS for external domains, so that it is accessed faster when URLs are clicked to them or when your site loads external assets from them. To find out what to add, navigate your site in Chrome Incognito> Inspect> Fonts…. In the Prefetch field, write all the external domain sources that Incognito shows you (google analytics calls, TTFs, social media elements, chat services, CDNs, etc.).
• DNS prefetch control: since you have added the URLs in the field of the previous item, it is not necessary to activate it.
• Load Google Fonts asynchronously: activate it, but check that the fonts are displayed correctly.
• Remove Google Font: Prevent external Google fonts from loading on your site. The only reason one would enable this option is if one has placed the font files locally on the server itself and made the necessary CSS adjustments.
• Delete WordPress emojis: ON. It removes a little JS emoji call that is useless today since modern browsers can natively display emojis.
• Remove Noscript tag: just remove the tags

Page Optimization – Media Settings

• Delay loading images: loads images only when the browser scrolls to them (hidden on-screen images are not loaded). It is a personal option because also scrolling and that the images take time to appear may not be the most convenient from the user experience. If we have to tip the balance to one side, it would be OFF.
• Basic Image Placeholder – This is what our site users will see moments before the images finish loading (a transparent image can be used).
• Adaptive placeholder: ON if you have decided to delay loading images higher. It is convenient to reserve the space to prevent the design of our site from moving from one side to the other as the images are loaded (this is considered by Google as a negative aspect).
• Adaptive SVG placeholder – The image file to use as the placeholder.
• Customizable placeholder color – the name implies. Choose the color you want
• LQIP Cloud Builder – Advanced placeholder technology that displays a very low-quality version of the image that will soon be replaced by the original version of the file. Ideal for enhancing the user experience on image-heavy sites – the blurred version loads instantly and reduces the distraction of lazy-loading images. It is an excellent option compared to other technologies.
• LQIP Quality: 4 is OK but testing is always welcome.
• Minimum LQIP dimensions: leave it at the recommended value.
• Generate LQIP in the background: it is recommended to test ON versus OFF on pages outside the cache. In principle, and without testing, leave it ON.
• Lazy Load Iframes: useful in cases where there are iframes or video embeds that are not used above the fold.

Page Optimization – Media Excludes

• Image Delayed Upload Exclusions: Exclude the images in this list from lazy upload. It is a good choice for the important or most viewed images.
• Class name exclusion for image lazy loading: This allows you to exclude from lazy loading all images that share a class name.
• Lazy loading exclusions from parent classes – a good resource for excluding images that don’t have a CSS class assigned; instead, it is excluded by its primary class.
• Iframe class lazy loading exclusions – a great way to exclude certain videos from lazy loading (like those used near the top of your site) or those that take longer to load and you don’t want to delay everything because of their weight.
• Lazy loading exclusions of parent classes of iframes: Convenient to exclude iframes with the parent class names you list.
• Exclusion of lazy loading URIs: here you can list URLs where you do not want lazy loading to take place (for landings where images/videos need to be loaded right away).
• LQIP Exclusions: The images you list here will not generate a low-quality preview version waiting for the final image (you can use full URLs or partial strings).

Page Optimization – Localization Settings

• Gravatar cache: useful for sites where (1) comments are made daily and (2) tons of them. Not recommended if your site does not have comments enabled or few are made per week.
• Gravatar Cache Cron: If you cache gravatar, this option should be ON as well.
• Gravatar Cache TTL: Default is 604800 seconds (a whole week) and this is not bad but a higher value is recommended as it is rare for people to change their Gravatar avatar often. Therefore, 7257600 is a figure more in line with reality (three months).
• Localized resources: it is favorable to turn it ON when Google measurements suggest optimization of JavaScript and/or other resources that are hosted on domains such as Google itself or Facebook (we actually have no control over these resources because they are not on our server). By setting this option to ON, these external resources will be copied to your own server (and can be optimized at will).

Database

Database – Manage

• Clear all: run all the optimizations you see on the screen.
• SPAM comments: it may be convenient to take a look before deleting them in case there are false positives.
• All transient data: it is recommended to delete it.
• Post Revisions: delete all the historical revisions of the Tickets (remember that WordPress keeps an “Database, manage” list to recover an entry to a previous stage.
• Comments sent to trash: delete all comments inside the ‘Trash’ folder.
• Optimize Tables: activate it.
• Automatic Drafts: It may be best to take a look before deleting them.
• TrackBacks / PingBacks: delete them, if they exist.
• Clean CSS / JS optimizer: run without hesitation.
• Entries sent to trash: delete existing Entries in the ‘Trash’ folder.
• Expired transient data: delete it without hesitation.

Database – DB Optimization Settings

• The maximum number of reviews: you can set a limit if your site’s database is too large, with many posts and therefore a long history of reviews. Leave at 0 if you keep your site clean; otherwise, enter a larger number (10 or 20).
• Maximum age of revisions: you can configure it to automatically delete the revisions after a certain time (ex: 7 days). I do not recommend touching it because an Entry could have an error and the revision system works as a backup.

Crawler

Crawler – Summary

Note: this section does not have much effect unless you have a dedicated server. Most LiteSpeed-enabled hosting providers will not activate the crawler option to conserve resources (and you will see the legend ” The crawler feature is not activated on the LiteSpeed ​​server. Please check with your server administrator “).

The vast majority should not touch anything in this section unless they intend to crawl more aggressively.

• Reset position: reset if you want to start over from the beginning (typical after a total cache purge).
• Execute Manually – Crawling is started on the spot (rather than waiting for CRON to dictate).
• Clean up the Crawler map: A crawl map is like a sitemap but a Crawler version. You can clean it whenever you want or need to generate a new one (for example, after adding new content pages).
• Refresh the Crawler map: doing so will probably be positive after making changes to your site or after having executed the previous option. After this action, you will be able to see which pages are or are not crawled and add those that should not be crawled automatically to the blacklist.
• Blacklist: delete if necessary.

Crawler – Map

In this section, you can view the URIs that are currently in the map product of the crawl.

If you don’t see anything listed, try hitting the ‘Reload Tracker Map’ button.

From here you can manually add URIs to the blacklist using the corresponding button next to each entry. The ‘Tracker Status’ column uses colored dots to make it easier to read the Status of each of the URIs. If necessary, the ‘Clear Tracker Map’ button performs a clean slate.

Crawler – Blacklist

In this section, you can view the URIs currently blacklisted. Any URI can be manually removed via the button next to each entry.

The ‘Status’ column uses colored dots to provide the status of each URI. If necessary, the ‘Clear blacklist’ button performs a clean slate.

Crawler – General Settings

• Crawler: ON to enable automatic cache creation. It uses server resources, so it is not recommended in cases of shared and/or saturated servers. On the other hand, if you have a dedicated server, you must inhabit it without hesitation.
• Delay – The default is best for the vast majority of cases. Only adjust in case your site has a number greater than 30,000 entries or pages.
• Duration of execution: the default value is correct for most of the cases (only increase it for priority sites in the scenario of dedicated servers with more than one own site).
• The interval between executions: the default value is correct for most cases (only decrease it for priority sites and/or when the server is idle for frequent periods).
• Indexing interval: the default recommended value of 302400 (3.5 days) is indicated. It is possible to force it up to 86,400 (1 day) if your site is small (less than 3000 pages) or if you have your own server.
• Threads: the default value of 3 is recommended. Setting a higher number causes faster crawls, but it doesn’t matter much unless you have about 200 pages. Also, it’s good to remember that more CPU is being used, so don’t set a high value on servers with many sites and/or constant high CPU usage.
• Timeout: specifies the time to wait while each URL is crawled. The default value of 30 is recommended.
• Server load limit: the default value of 1 is recommended and safe for most servers (enter 2 or 3 with a dedicated server).

Crawler – Simulation Settings

This section is useful only if you want to pre-crawl pages for logged-in users (the standard crawl feature already covers unconnected public users).

• Role simulation: allows you to pre-cache pages for specific users (enter one user per line if necessary for your site).
• Cookie simulation: pre-track for specific cookies. To track a particular cookie, enter the name of the cookie and the values ​​you need to track, one per line.

Crawler – Sitemap Settings

• Custom sitemap: LiteSpeed ​​pre-crawls a site automatically, but here you can add your own sitemap, typically the one generated from the XML sitemap plugin.
• Remove the domain from sitemap: leave it ON unless you have multiple domains in the sitemap (typically for multiple languages).

• JS: OFF is more secure; if it is set to ON, carry out meticulous tests of all the functionalities of your site.
• Js Combine external and inline: if the previous item is activated, we recommend that you activate this one as well: it helps to maintain the JS execution priorities that should correct the potential errors caused by the JS combination.
• JS Push HTTP / 2: OFF is more secure and on most sites activating it does not improve speed.
• Defer loading from JS: OFF is more secure. Some JS is used for critical items above the ‘fold’ and therefore should not be deferred.
• Load Embedded JS – Downloads the embedded JS after the DOM has been completed to improve JS compatibility and reduce JavaScript errors if other features are enabled. ‘Deferred’ is recommended only if one is willing to try all the functionalities of the site after having activated it.

Result Matters – Conclusion

Eagerly waiting for the result? Yah.

Let’s see the result:

My heart is willing to say: Boom!

Now, all Core Web Vitals metrics, LCP (Largest Contentful Paint), FID (First Input Delay), and CLS (Cumulative Layout Shift) have a good score. Website speed is also incredible.

LiteSpeed ​​is the most versatile and powerful solution today to greatly speed up any website. Therefore, it only remains to download and activate the LiteSpeed ​​plugin on your site and follow these steps in the guide to configure Litespeed Cache to fix Core Web Vitals errors.

If the cache issue is giving you headaches, do not hesitate to contact us because we are here to help you. In parallel, take advantage of the comments section below to share your experiences with us and the rest of the community. We read and respond to all comments.

We wish you were able to speed up your site a lot and improve your online scores! Successes, and thanks for reading.