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.[\/vc_column_text][nectar_cta btn_style=”curved-arrow-animation” heading_tag=”h6″ button_color=”default” text_color=”#000000″ button_border_color=”#0a0a0a” button_border_color_hover=”#075aff” button_border_thickness=”1px” link_type=”new_tab” alignment=”left” alignment_tablet=”default” alignment_phone=”default” constrain_group_3=”yes” constrain_group_4=”yes” display=”block” display_tablet=”inherit” display_phone=”inherit” link_text=”View Speed Report” url=”https:\/\/pagespeed.web.dev\/analysis\/https-themenectar-com\/e8hibfyzsy?form_factor=mobile” padding_top=”1em” padding_bottom=”1em” padding_left=”2.5em” padding_right=”2.5em”][vc_row_inner column_margin=”50px” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” top_padding=”60″ text_align=”left” row_position=”default” row_position_tablet=”inherit” row_position_phone=”inherit” overflow=”visible” pointer_events=”all”][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][image_with_animation image_url=”10827″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/vc_column_inner][vc_column_inner column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default” phone_text_alignment=”default” background_color_opacity=”1″ background_hover_color_opacity=”1″ column_backdrop_filter=”none” column_shadow=”none” column_border_radius=”none” column_link_target=”_self” overflow=”visible” gradient_direction=”left_to_right” overlay_strength=”0.3″ width=”1\/2″ tablet_width_inherit=”default” animation_type=”default” bg_image_animation=”none” border_type=”simple” column_border_width=”none” column_border_style=”solid”][image_with_animation image_url=”10826″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/vc_column_inner][\/vc_row_inner][\/tab][tab icon_family=”none” title=”Hosting” id=”1713358960494-10″ tab_id=”1713358960495-4″][vc_column_text]\n
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<\/a> 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.[\/vc_column_text][image_with_animation image_url=”10886″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_target=”_blank” border_radius=”none” box_shadow=”none” image_loading=”default” max_width=”custom” img_link=”https:\/\/www.cloudways.com\/en\/?id=823536″ max_width_custom=”200″][\/tab][tab icon_family=”none” title=”Performance Options” id=”1713358960506-6″ tab_id=”1713358960506-3″][vc_column_text]\n To access the built-in theme performance options provided by Salient, go to the Theme options panel \u2192 General Settings \u2192 Performance tab.[\/vc_column_text] Ensure that you have the Salient performance option Lazy Load Page Builder Element Images<\/strong> enabled in your setup.<\/p>\n 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.[\/vc_column_text][image_with_animation image_url=”10796″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” border_radius=”15px” box_shadow=”none” image_loading=”default” max_width=”100%” max_width_mobile=”default”][vc_column_text]Secondly, we highly recommend using Performance Lab<\/a> for automatically converting images to .webp format upon upload. This free plugin, developed by the Core WordPress Performance Team<\/a>, will significantly improve your image file sizes and address the warning from PageSpeed Insights to serve images in next-gen formats<\/strong>.[\/vc_column_text][image_with_animation image_url=”10865″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_target=”_blank” border_radius=”15px” box_shadow=”none” image_loading=”default” max_width=”custom” img_link=”https:\/\/wordpress.org\/plugins\/performance-lab\/” max_width_custom=”225″][vc_column_text]Please be aware that if you’re adding the Performance Lab plugin to an existing setup, you will need to regenerate your images<\/a> to handle any existing files on your server.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/tab][tab icon_family=”none” title=”Above the Fold Tips” id=”1713358960548-6″ tab_id=”1713358960548-8″][vc_column_text]\n Google’s mobile PageSpeed Insights test is particularly unforgiving when it comes to delays in displaying content to the user.<\/p>\n 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<\/strong> that would be immediately visible to the user on mobile. Furthermore, removing lazy loading for images above the fold<\/strong> is also advised.<\/p>\n Most Salient elements provide options to disable their selected animation or lazy loading specifically for mobile for this purpose.[\/vc_column_text][image_with_animation image_url=”10834″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/tab][tab icon_family=”none” title=”WPRocket” id=”1713358960556-2″ tab_id=”1713358960556-2″][vc_column_text]\n The follow settings are recommended if using WPRocket as your performance plugin.[\/vc_column_text][vc_column_text]\n We recommend enabling the caching option for mobile devices.[\/vc_column_text][image_with_animation image_url=”10853″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][image_with_animation image_url=”10861″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][divider line_type=”No Line” custom_height=”5vh”][vc_column_text]\n You can experiment with Optimize CSS delivery, but it may cause unexpected styling issues. For this reason, we do not use it ourselves.[\/vc_column_text][image_with_animation image_url=”10859″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][divider line_type=”No Line” custom_height=”5vh”][vc_column_text]\n First, ensure that you’ve enabled the Salient performance option for “Delay JavaScript Execution” in the Theme options panel \u2192 General Settings \u2192 Performance tab.[\/vc_column_text][image_with_animation image_url=”10851″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][vc_column_text]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.<\/p>\n In the WPRocket > File Optimization tab, leave minify JavaScript files disabled, and enable the option for Delay JavaScript Execution<\/strong> 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.[\/vc_column_text][image_with_animation image_url=”10854″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/tab][tab icon_family=”none” title=”W3 Total Cache” id=”1713358960622-5″ tab_id=”1713358960622-3″][vc_column_text]\n 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 \u2192 General Settings tab<\/strong>.<\/p>\n However, before heading to that area, ensure that you’ve enabled the Salient performance option for “Delay JavaScript Execution” in the Theme options panel \u2192 General Settings \u2192 Performance tab.[\/vc_column_text][image_with_animation image_url=”10851″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][divider line_type=”No Line” custom_height=”5vh”][vc_column_text]\n We recommend enabling the page cache option.[\/vc_column_text][vc_column_text]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.[\/vc_column_text][image_with_animation image_url=”10868″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][divider line_type=”No Line” custom_height=”5vh”][vc_column_text]\n We recommend enabling the option to Minify[\/vc_column_text][image_with_animation image_url=”10869″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][divider line_type=”No Line” custom_height=”5vh”][vc_column_text]\n We recommend enabling the option to use Object Cache[\/vc_column_text][image_with_animation image_url=”10872″ image_size=”full” animation_type=”entrance” animation=”None” animation_movement_type=”transform_y” hover_animation=”none” alignment=”” img_link_large=”yes” border_radius=”15px” box_shadow=”small_depth” image_loading=”default” max_width=”100%” max_width_mobile=”default”][\/tab][\/tabbed_section][\/vc_column][\/vc_row]\n","protected":false},"excerpt":{"rendered":" [vc_row type=”full_width_background” full_screen_row_position=”middle” column_margin=”default” column_direction=”default” column_direction_tablet=”default” column_direction_phone=”default” bg_color=”#ffffff” scene_position=”center” top_padding=”6%” bottom_padding=”12%” text_color=”dark” text_align=”left” row_border_radius=”none” row_border_radius_applies=”bg” overflow=”visible” overlay_strength=”0.3″ gradient_direction=”left_to_right” shape_divider_position=”bottom” bg_image_animation=”none” shape_type=”” gradient_type=”default”][vc_column column_padding=”no-extra-padding” column_padding_tablet=”inherit” column_padding_phone=”inherit” column_padding_position=”all” column_element_direction_desktop=”default” column_element_spacing=”default” desktop_text_alignment=”default” tablet_text_alignment=”default”…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages\/8784"}],"collection":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/comments?post=8784"}],"version-history":[{"count":13,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages\/8784\/revisions"}],"predecessor-version":[{"id":10929,"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/pages\/8784\/revisions\/10929"}],"wp:attachment":[{"href":"https:\/\/themenectar.com\/docs\/salient\/wp-json\/wp\/v2\/media?parent=8784"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}Salient Performance Options<\/h3>\n
\n
\n
Image Optimization<\/h3>\n
Above the Fold Tips<\/h3>\n
WPRocket Recommended Settings<\/h3>\n
Cache<\/h4>\n
CSS File Optimization<\/h4>\n
JS File Optimization<\/h4>\n
W3 Total Cache<\/h3>\n
Page Cache<\/h4>\n
Minify<\/h4>\n
Object Cache<\/h4>\n