Your website’s speed is crucial. If it loads slowly, users may abandon your site. Fortunately, there is an easy way to speed your WordPress site with the amazing cache plugin called LiteSpeed Cache by LiteSpeed. This plugin is one of the most popular WordPress caching plugins.
Here’s my guide to how to use LiteSpeed Cache to get the most out of it.
1. What is Speed Optimization of a Website?
What is speed optimization? You can see the differences by simply visiting some websites. Some websites load slow. However, statistics show that 90% of website visitors expect sites to load within two seconds. Visitors will likely leave the site if it takes longer than two seconds.
Websites must therefore be as responsive as possible.
These factors are the most important to your website’s visitors. They also have an impact on SEO, site rank, indexing, etc.
2. 2. Obstacles to Website Optimization
Many website owners don’t realize the importance of speed optimization. This is especially true if your business is small or you are a startup. While most people are aware that there are many ways to speed up websites, there are also obstacles. Many people don’t know what obstacles are.
2. 2. Unoptimized images and media
Websites with slow pages load speed and low page load speeds are often due to unoptimized media and images. Many content writers copy and paste images from blogs or websites, but don’t optimize them. Unoptimized images are often caused by the incorrect and heavy formats.
You can optimize images before or after they are uploaded to WordPress. We can either create an optimized image and upload it in web-compatible format, or upload it and optimize it with LiteSpeed cache. This will be discussed later in this post.
3. Too many widgets and plugins
Sometimes, users install plugins that they forget to delete. WordPress will still load all files from the plugin, slowing down your site.
4. Bad choice of server
It is important to choose the right Web hosting server. This will affect your website’s performance. Your website’s speed can be negatively affected if your server resources aren’t up to par or your server location is too far from your target audience.
Always seek out servers that are closer to your target audience. Make sure the server can handle the load based on your site traffic.
5. Poor Coding Standards
It is important to write code efficiently when building websites. Not all developers can write efficient code. Developers who write lots of code to implement a single function can make websites slow and unoptimized.
Before you make any modifications, ensure you adhere to good coding practices and avoid relying on external libraries.
3. WordPress and LiteSpeed Cache
WordPress is a free CMS, and LiteSpeed cache can be used as a WordPress Plugin.
WordPress is an open-source platform for creating websites. WordPress is a content management platform (CMS). PHP is used to create WordPress and pair it with MariaDB or MYSQL databases. WordPress was initially created to be a blogging platform. WordPress is used by 41.4% the 10 million most popular websites as of May 20,21. WordPress is used by 455 million websites according to the internet.
3.2. LiteSpeed Cache
LiteSpeed Cache plugin is a WordPress plugin. LiteSpeed can be used to optimize WordPress sites and increase their speed.
Because running tests on a plain WordPress installation is not fair, we will install WP Ocean theme. Also, we will install an E-Commerce demo to ensure that our tests are run on a large site. We chose the e-commerce demo store and imported that into our website so we can perform tests with some data on-site.
5. Performance without LiteSpeed Cache.
After importing demo data from WP Ocean first let’s check the performance of the website without LiteSpeed Cache and check all progress.
Different page speed testing tools can affect performance
Let’s test the page speed on the demo site with SpeedTest tools. After optmizations, we will run these tests again.
Google PageSpeed insight
The site doesn’t have much data, so the speed tests aren’t too bad. OceanWP is also a great theme
Speed test results are fine but we will check what is changed after enabling LSCache
6. Enable LiteSpeed Cache and perform custom Optimization
6.1 CSS Optimizations using LiteSpeed Cache, Performance Improvements and Other Features
For CSS optimization, visit theLiteSpeed Cache->Page Optimizations->CSS Setting.
This will reduce the size of your CSS files as well as inline CSS. You can also turn this ON if you don’t use any external CSS controllers like Cloudflare or similar.
This will combine all your CSS files. To ensure that your website design is not broken, turn it on and double-check it.
CSS Combination of External and Inline
When CSS is enabled, you can include both inline and external CSS in a combined file. This option preserves CSS Combine’s priorities and minimizes potential errors. It will be turned ON.
Load CSS Asynchronously:
While this may increase your score on speed testing platforms, it can also cause problems with site initial display. So keep it off.
Create critical CSS:
Critical CSS will load and generate the necessary CSS before the rest. This option can be enabled by thoroughly checking your website to ensure that nothing is broken. We will leave this off for now.
Create critical CSS in Background
A cron-based queue automatically generates critical CSS in the background. This article will turn it off.
Separate CCSS Cache Post Types:
Types of list-post should include each item having its own CCSS.
Keep it default.
6.3 Image Optimizations using LitSpeed Cache Performance
LiteSpeed Cache allows you to optimize images on your website. Image optimization can be done at theLiteSpeed Cache-> Image Optimization-> Gather Data.
To optimize the image click on Gather Data button and optimization will start. You can see the progress in the sidebar of this screen.
If you want to do any settings for image optimization click on Image Optimization Settings.
6.4 Cache setup using LiteSpeed Cache.
LiteSpeed cache supports different types of caches. Go to theLiteSpeed Cache->Cache
There are many options available, including Cache, TTL and purge, Exclude, ESI. Object, Browser, Advanced.
- Enable LiteSpeed Cache- Keep it on to cache will work. This is the default page-caching of LSCache.
- Cache Logged-in Users- Cache pages available for users logged in.
- Cache Login Page –You can leave it on because the login page won’t be changed much.
- Cache favicon.ico- Keep it ON to load the favicon from the cache
- Cache PHP Resources- This is a must-have
- Cache Mobile- If your phone has a different theme, keep it ON.
- Drop the query string- You can either drop the query strings from URLs or create one cache copy.
Keep all values default and change if you are an expert user.
Purge All On Upgrade:
Keep it on. And keep others as default.
Add anything accordingly if you want to exclude anything from getting cached.
Redis Cache can be enabled to reduce the load on your database.
Browser caching saves static files locally within the browser. This setting can be changed ON Reduce repeated requests for static data.
7. Result after LScache custom optimization
7.1 Google PageSpeed Insight:
Results are improved by activating LS cache with custom settings.
7.1 Google PageSpeed Insight:
7.2 GTmetrix Result:
8. High PageSpeed has many benefits.
A happy website is one that’s fast. Google requires that PageSpeed be an integral part of their ranking algorithm. Users have also taken into consideration how long it takes websites to load. PageSpeed affects:
- Search Engine Ranking for the website.
- User Experience
- Conversion rate