Skip to main content

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.0+) 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.

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.

WPRocket Recommended Settings

The follow settings are recommended if using WPRocket 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