Introduction

The topic of page speed can be quite complex, as it involves numerous factors. However, Salient provides a variety of user-friendly built-in performance options that aim to simplify the process. Below, you will find documentation on the built-in performance settings, along with recommendations for third-party plugins to help you achieve a high-performing setup.

Hosting

The initial and crucial step to ensure excellent performance, irrespective of your WordPress theme, is to have a reliable server from a reputable hosting company. Some key aspects to consider are ensuring that your server operates on a modern version of PHP (8.1+) and has a caching layer like Varnish in place. CloudWays is an excellent option for an affordable, high-performing hosting company that will ensure you’re set up for success with their pre-configured stacks optimized for fast WordPress instances.

Salient Performance Options

To access the built-in theme performance options provided by Salient, go to the Theme options panel → General Settings → Performance tab.

Loading Google Fonts Locally

If you’re using Google Fonts through Salient Options → Typography, you can significantly improve performance—especially your Lighthouse FCP and LCP scores—by serving those fonts locally.

To enable this, go to Salient Options → General Settings → Performance and toggle on “Load Google Fonts Locally.”
Salient will automatically download any Google Fonts you’ve selected, preload the ones used in top-level sections, and serve them directly from your server for faster loading.

Remove Unused Colors / Fonts

To reduce the dynamic CSS generated for your site and minimize the number of font files loaded, follow these steps:

1. In the Salient options under the Accent Colors tab, remove any global colors that are not in use on your site. To do this, click on the color and delete its value.

1
2
3
4
5

2. In the Salient options under the Typography tab, remove any fonts that are not in use on your site. To do this, open the Font Family dropdown and delete the value.

1
2

If you’re using custom fonts for your website, you can disable the default Salient font (Open Sans) from loading by selecting the ‘Do not load default font‘ option under ‘Default Theme Font Functionality‘ in the main Typography tab.

Image Optimization

Ensure that you have the Salient performance option Lazy Load Page Builder Element Images enabled in your setup.

With this feature enabled, it is recommended to avoid lazy loading for any images or background layers that appear above the fold (top-level) on your pages. This will ensure that the first section of your page renders as fast as possible without requiring JavaScript to load. You can manually edit any element containing an image and specify that the element should skip the lazy loading.

Secondly, we highly recommend using Performance Lab for automatically converting images to .webp format upon upload. This free plugin, developed by the Core WordPress Performance Team, will significantly improve your image file sizes and address the warning from PageSpeed Insights to serve images in next-gen formats.

Please be aware that if you’re adding the Performance Lab plugin to an existing setup, you will need to regenerate your images to handle any existing files on your server.

Above the Fold Tips

Google’s mobile PageSpeed Insights test is particularly unforgiving when it comes to delays in displaying content to the user.

While the desktop test may not be significantly impacted by animations on top-level content, the mobile score will be noticeably affected. If you’re keen on optimizing your mobile page score, it’s highly recommended to disable animations on any top-level elements that would be immediately visible to the user on mobile. Furthermore, removing lazy loading for images above the fold is also advised.

Most Salient elements provide options to disable their selected animation or lazy loading specifically for mobile for this purpose.

Optimize Top-level Images

In order to improve your FCP/LCP PageSpeed metrics, it’s recommended that you enable the “Optimize Top-level Images” option in Salient Options → General Settings → Performance. This will automatically preload and serve the optimal image sizes for faster loading.

WPRocket Recommended Settings

The following settings are recommended when using WP Rocket as your performance plugin.

Cache

We recommend enabling the caching option for mobile devices.

CSS File Optimization

You can experiment with Optimize CSS delivery, but it may cause unexpected styling issues. For this reason, we do not use it ourselves.

JS File Optimization

First, ensure that you’ve enabled the Salient performance option for “Delay JavaScript Execution” in the Theme options panel → General Settings → Performance tab.

With that theme option enabled, Salient will already be handling it’s own JavaScript optimization. Therefore you must exclude the theme directory from WPRocket to prevent double optimization/interference.

In the WPRocket > File Optimization tab, leave minify JavaScript files disabled, and enable the option for Delay JavaScript Execution with Salient added as an exclusion in the Themes toggle. This setup ensures that WPRocket will still optimize all of your third-party JavaScript but leave Salient to run its own optimizations.

W3 Total Cache

Most of the default settings are already optimal out of the box from W3 Total Cache. The main things you’ve need to change are in the W3 Total Cache → General Settings tab.

However, before heading to that area, ensure that you’ve enabled the Salient performance option for “Delay JavaScript Execution” in the Theme options panel → General Settings → Performance tab.

Page Cache

We recommend enabling the page cache option.

It’s worth noting that after enabling the caching option, your site will take longer than usual to generate each page/post the first time it’s visited, as the cache is being created. However, once the cache is established, your pages will load much quicker than before. The initial delay is a trade-off for significantly improved loading times in the future.

Minify

We recommend enabling the option to Minify

Object Cache

We recommend enabling the option to use Object Cache