How To Setup The Perfmatters Settings, Use The Script Manager, And Avoid Duplicate Functionality In Cache Plugins

Perfmatters settings

In this guide, I’ll show you how to set up the Perfmatters settings.

This includes using the script manager to remove unused CSS/JavaScript and what to do when your cache plugin includes overlapping features like remove unused CSS (spoiler: FlyingPress does the best job while WP Rocket + Perfmatters handle it the same way, but only enable one).

I use Perfmatters because it addresses several optimizations not found in most cache plugins. The script manager and bloat removal settings alone are worth it and you may find other features not found in your cache plugin (preload critical images, host fonts/analytics locally, delay JavaScript, remove unused CSS, preload/prefetch/preconnect). It depends on which cache plugin you’re using; I found it has many things SiteGround Optimizer + WP Rocket lack.

I prefer it over Asset CleanUp since it has more features and the interface is cleaner. You can browse their documentation and changelog, but I’ll try to cover everything in this guide. Enjoy!

Affiliate Disclaimer – I use affiliate links to Perfmatters and would really appreciate your support. It helps me write more helpful tutorials like this one. Seriously, thank you!

 

1. General

  • Disable Emojis: ON – removes JS file loaded by emojis.
  • Disable Dashicons: ON – prevents admin icon font from loading on the frontend.
  • Disable Embeds:ON – when you paste a URL into your WordPress editor, this feature loads a pretty preview (from YouTube, Facebook, Tweets, etc). Disable if you don’t use it.
  • Disable XML-RPC: ON – bad for speed + security (used to publish content from mobile).
  • Remove jQuery Migrate: ON – leave on if you’re using a page builder, disable otherwise.
  • Hide WP Version: ON – improves security by hiding WP version from showing publicly.
  • Remove wlwmanifest Link: ON – you likely don’t use Windows Live Writer, so disable.
  • Remove RSD Link: ON – used to edit your site in a browser instead of blog clients.
  • Remove Shortlink: ON – disable if you’re using the “post name” permalink structure.
  • Disable RSS Feeds: OFF – only enable this if you don’t have a blog on your website.
  • Remove RSS Feed Links: ON – removes unnecessary links in your RSS feed to pages, posts, comments, categories, tags, etc. This will remove a little unused code on your site.
  • Disable Self Pingbacks:- ON – disables pingbacks when linking to your own blog.
  • Disable REST API: disable for non-admins – hides usernames of anyone who published on your site to improve security, but completely disabling it often leads to errors with Gutenberg and certain plugins. Therefore, disabling Rest API for non-admins is safest.
  • Remove REST API Links: ON – removes a short line of code created by the REST API.
  • Disable Google Maps: OFF – some themes/plugins have the Google Maps API built-in with no option to disable this, in which case you can disable Maps if you don’t use them.
  • Disable Password Strength Meter: ON – removes a file that can sometimes load on your website when it should usually only load on account, checkout, and password reset pages.
  • Disable Comments: OFF – you probably don’t want to disable your blog comments.
  • Remove Comment URLs: ON – disables comment author links which are often spam.
  • Add Blank Favicon: OFF – only used for speed testing purposes on fresh WP installs.
  • Remove Global Styles: ON – removes 311 lines  of unminified code which seemed to be added by mistake to WordPress core. It was originally added to improve duotone styles.
  • Heartbeat: only allow when editing posts/pagesrecommended by Perfmatters. This disables Heartbeat unless you’re editing content, then set the Heartbeat Frequency to 60s. This reduces Heartbeat requests and reduces CPU usage, but enables only when needed.
  • Limit Post Revisions: 5 – gives you a few backups of old posts in case you need to restore a post to an earlier version, but prevents too many revisions from bloating your database.
  • Autosave Interval: 5 minutes – increase frequency to reduce CPU and save resources.
  • Change Login URL: add a custom login URL – stops unwanted requests by hiding wp-login from bots/attackers. If using QUIC, keep the default URL since it has features to protect it. You can also change the redirect/message when the default login is viewed.

 

2. Assets

If your cache plugin already defers/delays JavaScript, leave those settings OFF unless you have additional JS files to delay. You should use Perfmatters to remove unused CSS in most cases since it can load used CSS in a separate file (same as FlyingPress) which is faster than inline (a slower method used by WP Rocket). SiteGround Optimizer doesn’t have delay JavaScript or remove unused CSS in which case, you would use Perfmatters.

JavaScript

  • Script Manager: ON – remove unused CSS/JS on specific pages/posts (see below).
  • Defer JavaScript: OFF – fixes render-blocking resources in PSI and can include jQuery.
  • Delay JavaScript: OFF – only use this if your cache plugin doesn’t have this feature already (i.e. SiteGround Optimizer). In which case, configure it using the next 3 settings.
  • Delay Behavior: only delay specified scripts – better control of which files are delayed. “Delay all scripts” is more aggressive but may include files loading above the fold and others you may not want delayed. In that case, you would need to exclude those files.
  • Delayed Scripts: even if you’re already using a cache plugin for this, there may be other JS files you want delayed. For example, if you used Perfmatters to host GA locally using analytics.js, you can delay it. Or maybe there’s a plugin like WPdiscuz you want delayed that’s not included in WP Rocket’s default list (or even a third-party domain shown in your PSI report, like Gravatars). While there are common JS files you should delay (Google Analytics, Tag Manager, AdSense, Facebook Pixel), there may be other non-critical JS files too. Check your third-party code report in PSI and documentation in your cache plugin + Perfmatters. Perfmatters has instructions for delaying certain files and explains how to delay common third-party code, inline JavaScript, and why you can use both defer/delay.
  • Delay Timeout: amount of time to delay JavaScript. I found that you usually have to do it for about 5s (or more), otherwise you may not see as good of results in some speed tests.

Check the examples in the Perfmatters documentation, but here are common files:

ga( '
ga('
google-analytics.com/analytics.js
analytics.js
gtagv4.js
analytics-minimal.js
/gtm.js
/gtag/js
gtag(
/gtm-
adsbygoogle.js
fbevents.js
fbq(
/busting/facebook-tracking/
wp-content/themes/script-name
wp-content/plugins/plugin-name

Using The Script Manager

Once the script manager is enabled, view any page/post and you’ll see it on top.

Perfmatters script manager tab

In your script manager settings, I recommend enabling display dependencies and test mode which only shows the script manager changes to logged-in admins (since disabling CSS/JS can sometimes break your site). Whenever you’re ready to publish changes, simply toggle this off.

Perfmatters script manager settings

View the scripts/styles loading on the post (they should be categorized by plugins). You can disable them everywhere, on the current URL, use regex (URL patterns), and make exceptions.

Disable plugins perfmatters

Disable elementor plugins perfmatters

Examples

  • Disable social sharing buttons everywhere but posts.
  • Disable contact form plugin everywhere but contact page.
  • Disable slider/gallery plugins everywhere but certain URLs.
  • Disable extra page builder plugins where they’re not being used.
  • Disable email plugins on pages if forms are only used on your blog.
  • Disable unused page builder CSS/JS (most have built-in settings for this).

CSS

  • Remove Unused CSS: ON – Perfmatters and FlyingPress arguably do a better job at removing unused CSS than WP Rocket because they inline critical CSS, then used CSS is loaded in a separate style sheet. Whereas WP Rocket will inline the entire unused CSS (optimizing for scores but not real world browsing). And SiteGround Optimizer doesn’t have this feature. In other words, use either FlyingPress or Perfmatters this. And if you enable it, Perfmatters suggests disabling CSS preloads and uncombine CSS beforehand.
  • Used CSS Method: File – file for browsing speed, inline for scores (see above).
  • Stylesheet Behavior: Delay – what Perfmatters recommends for better LCP/FCP.
  • Clear Unused CSS: use this if you make design/code changes and aren’t seeing them.
Remove unused css wp rocket vs perfmatters vs flyingpress
Vikas’ post before Perfmatters added the “file” method… he explains why FlyingPress (and now Perfmatters) are faster
Remove unused css wp rocket cloudflare apo
Some argue WP Rocket is faster when using APO

 

3. Preloading

Preload, preconnect, prefetch are often recommended in PSI. Many cache plugins automatically preconnect CDN URLs and Google Fonts (and some add preload automatically too). Read up on your cache plugin’s documentation, then use Perfmatters to add more resource hints if needed.

  • Enable Instant Page: OFF – downloads pages in the background when users hover over a link. However, this can cause high CPU usage and the benefit might not outweigh the cost.
  • Preload: only do this for resources that need to load immediately like above the fold images, fonts, and CSS. Google may show you recommendations under “preload key requests” and “largest contentful pain element,” but you may be able to preload others.
  • Preload Critical Images: 2-3 – preloads above the fold images while also excluding them from lazy load. This should be set to the number of images usually shown above the fold (screenshot) which is usually 2-3. Great setting to automate this and improve LCP score.
  • Preconnect – CDN URLs and third-party Google Fonts (font.gstatic.com) are usually the only URLs you should preconnect. Your cache plugin may already do this, so make sure you check the documentation. Fonts should always be preconnected using CrossOrigin.
  • Prefetch – open your “reduce impact of third-party code report” in PSI (or GTmetrix Waterfall chart) and they’ll list all third-party domains loading on your site. Other than CDN URLs + third-party fonts which you’ll use preconnect, the rest should be prefetched.
Third party code
Third-party domains should either be preconnected or prefetched (or better, hosted locally)

 

4. Lazy Loading

Permatters gives you more lazy load settings than some cache plugins with a viewport threshold and fade in effect, so it really depends on how effective your cache plugin is.

  • Images: ON – while using JS is said to be worse (what Perfmatters uses), they say it only adds 2.5KB and is better than native lazy load since more resources can be lazy loaded. If you enable it, native lazy loading in WordPress will be disabled and will show the option to exclude leading images. I wouldn’t use this because the number of images shown above the fold can be different depending on the page/post (excluding them manually is better).
  • iFrames And Videos: ON – lazy loads iframes and replaces iframes with a preview image so the “fat YouTube player” is only loaded when clicked. I have this enabled in FlyingPress which also hosts the thumbnails locally to prevent third-party requests from ytimg.com.
  • Exclude From Lazy Loading – above the fold images should be excluded from lazy load which can improve LCP. Copy those image URLs and add them so they’re not lazy loaded.
  • Threshold: 0px  – increasing this results in a smoother scrolling experience since images start loading before they’re shown in the viewport, but 0px is the most aggressive option.
  • DOM Monitoring – OFF (only enable if you use infinite scrolling). Perfmatters says this “watches for changes in the DOM and dynamically lazy loads newly added elements. This improves compatibility for third-party plugins and themes that utilize infinite scrolling…”
  • Add Missing Images Dimensions: ON – adds width/height to images without dimensions to prevent layout shifts while fixing the “use explicit width + height” PSI recommendation.
  • Fade In: ON – adds a fade in effect for lazy loaded images so they don’t jump in suddenly.

 

5. Fonts

  • Disable Google Fonts: OFF – only use if you’re in the process of using system fonts or custom fonts and need to disable them. Otherwise, it removes Google Fonts on your site.
  • Display Swap: ON – adds font-display: swap to the font CSS which can fix “ensure text remain visible during webfont load” in PSI. While it fixes FOIT (flash of invisible text) by setting a fallback font, it can also cause FOUC (flash of unstyled text) which can look ugly.
  • Local Google Fonts: ON – downloads fonts.google.com fonts and hosts them locally.
  • CDN URL: add your CDN URL to serve self-hosted fonts from your CDN (i.e. BunnyCDN).

 

6. CDN

  • Enable CDN Rewrite – ON – if you’re using a CDN URL, this rewrites assets to be served from the CDN (i.e. https://cdn.yourwebsite.com/wp-content/uploads/2022/02/logo.png). Sometimes adding your CDN URL to multiple plugins can serve more assets from the CDN.
  • CDN URL: add your CDN URL – I recommend Cloudflare with BunnyCDN (or FlyingCDN).
  • Included Directories: generally nothing to do here  (Perfmatters automatically includes wp-content and wp-includes in the CDN rewriting, which should be all most sites need).
  • CDN Exclusions: .php,.xml is recommended when using SEO plugins with XML sitemaps.

 

7. Analytics

  • Enable Local Analytics: ON – host locally to prevent third-party GA requests.
  • Tracking ID: enter your Google Analytics tracking ID so it can be hosted locally.
  • Tracking Code Position: Header (Default) is what’s recommended by Google.
  • Script Type: analytics.js or minimal – these have smaller file sizes compared to other types, but disables some data in Google Analytics. Read the Perfmatters documentation and decide whether you want to disable the data in return for a small performance boost.
  • Disable Display Features: ON – disables remarketing and advertising options in GA which isn’t used by most people and prevents a second HTTP request to DoubleClick.
  • Anonymize IP: ON – shortens IP address to comply with GDPR in some countries.
  • Track Logged In Admins: OFF – you don’t want admin visits in your analytics data.
  • Adjusted Bounce Rate: 30  – if visitors stay for longer than 30 seconds, they won’t be considered a bounce. This is recommended by Perfmatters and is on a scale from 1-100.
  • Use MonsterInsights: OFF – only enable if using MonsterInsights to host GA locally.
  • Enable AMP Support: : OFF – only enable if you’re using AMP which I don’t recommend.

 

8. Database

Most cache plugins already clean your database, but I always recommend installing WP-Optimize once since it can delete tables left behind by old plugins, while cache plugins can’t.

Otherwise, I would remove everything but post revisions + post auto-drafts since you want to keep (at least a few) backups of posts. Sometimes I get automatic Windows updates that close everything down. Thankfully, the auto-drafts have saved me from losing work quite a few times.

 

Perfmatters With A Good Cache Plugin Is The Way To Go

I feel like the Perfmatters team saw all the things lacking in (most) cache plugins then added it to their plugin. Perfmatters with FlyingPress or LiteSpeed Cache is definitely the way to go IMO.

I have it installed with FlyingPress which I recommend instead of WP Rocket or SiteGround Optimizer. I’ll save that for another tutorial.

Asset CleanUp SG Optimizer WP Rocket FlyingPress Perfmatters
Asset unloading x x x
Delay JavaScript x x
Remove unused CSS x x Inline Separate file Separate file
Critical CSS x x x
Host analytics locally x x x x
Smaller GA tracking code x x x x
Host fonts locally x x
Font-display: swap
Exclude above the fold images x By class By URL By number By number
Preload critical images x By class By URL By number By number
Lazy load background images x Inline Helper class Helper class CSS
Specify image dimensions x x
Preload links x x
Preload scripts/styles x x x x
Disable XML-RPC x x x
Disable Heartbeat x
Move wp-login x x x x
Change autosave interval x x x x
Limit post revisions x x x x

Pefmatters vs asset cleanup poll

Cheers,
Tom

You Might Also Like:

9 thoughts on “How To Setup The Perfmatters Settings, Use The Script Manager, And Avoid Duplicate Functionality In Cache Plugins”

  1. My question is , if in CDN URL I should put the rocket.net CDN URL or not , I know is under Cloudflare but in admin page there is a CDN Url like vfdXXXXX.onrocket.site .
    Thank you!

    Reply
  2. I am using Wp Rocket to generate critical css, and use Perfmatters to remove assets. It looks like that Perfmatters’ “Remove Unused CSS” is more powerful and functional, do you think it is a good idea to use it instead of Wp Rocket’s?

    Many plugins have same functions, confused which plugin has better results.
    Thanks in advanca

    Reply
  3. I’m utilizing Jetpack and Sumome both free form. I discovered Sumome diminishing rate however again introduced for email. I’m an amateur. Would it be advisable for me to uninstall these 2 modules? I discovered websites recommending to utilize Jetpack. Just introduced WP Disable and designed glancing in your post. Much obliged. Would you be able to send an answer through email?

    Reply
    • Haven’t used Sumo but yes, JetPack can slow down your site and I would advise against using it. WP Disable is good but if you can, try and use another plugin for bloat removal like Perfmatters or Asset CleanUp.

      Reply
  4. It’s a great plugin because it’s super lightweight and gets better every year. I am starting to clearly favor it over other plugins because of the great and committed devs behind it who know a lot about optimization without bloat.

    Reply

Leave a Comment