Old thread but came up when I encountered a similar problem.
When using a host with a staging or dev environment like WpEngine, Siteground or Flywheel etc. or any server where a .htaccess password has been set.
Enfolds script merge function cannot verify the creation of the merged files and produces an error code 21 in the database merge fields.

The function should run correctly in live anyway
To resolve in staging environments – I assume for testing purposes – Remove the password temporarily and then turn script merging off and on again in the Enfold performance control panel and click save.
This will allow the process to verify the creation of the files and serve a merged script.
Live push – I would recommend disabling script merge and re-enabling it after going live because the process will need to run again in live anyway.
Hope this helps others.

• This reply was modified 3 years, 5 months ago by thinkjarvis. Reason: spelling mistake

This project was a conversion from an existing DIVI website.

Feel Positive Coaching ran by Fay Petcher is a holistic divorce and relationship coaching service. Fay is also an established Podcaster, Author and EFT Practitioner helping couples and individuals cope with narcissistic abuse, relationship trauma and infidelity.

The site was rebuilt in Enfold for ongoing support and performance features.
As part of the process the site was turned into a multi-page website from a one page design. Large padding and margins help give the site a modern – easy to scroll feel.
The logo and colour scheme were revised and entered into the Enfold theme control panel.

https://www.feelpositivecoaching.com/

The site scores 95/100 on mobiles in web vitals helping the site load quickly on all devices.

Performance stack:
Bespoke functions.php settings
WP-Optimize – Caching and HTML minification
EWWW WebP Conversion
Short Pixel thumbnail regenerator
Enfold Performance settings on
Bespoke .htaccess settings

Logo and Website designed by Think Jarvis Design and Marketing based in Swadlincote UK.

Hi Steve,

I was about to open a new thread about this.
When you set the header to a custom height since 4.8.6.4 it is no longer applying a fixed height on mobile devices below 989px wide.

I.e. I have a couple of sites with a 160px header and I can confirm they are now 160px on mobile devices instead of 90px on tablets and 80px on mobiles.

Add the following to Quick CSS to restore the usual heights on mobiles. This is a temporary fix.

@media only screen and (min-width: 768px) and (max-width: 989px) {
.responsive .logo a {
height:90px !important;
}
}

@media only screen and (max-width: 767px) {
.responsive .logo a {
height:80px !important;
}
}

• This reply was modified 3 years, 6 months ago by thinkjarvis.

@marcie73 @jay

There are multiple issues mentioned in your last posts and the solution will depend on your host and setup. It will be hard for the support team to advise further without looking at your actual setup in detail. Web vitals optimisation is bespoke and depends on any extra plugins and your server setup.

Without knowning your hosting setup it is difficult to advise on the best plugins to resolve the issue.

I tend to recommend Wp-Optimize as a free caching and html compression plugin. I let Enfold process the CSS and JS files from the performance panel. If you combine this with EWWW image compression plugin and Jetpack Boost. You have effectively added everything premium plugins can do without any extra costs.

Free critical CSS generator
Jetpack Boost includes a free critical CSS generator. This will remove the render blocking warning from Web Vitals but in most situations makes little difference to the performance scores. It can also cause some CLS issues because the CSS load order is altered by the inline critical CSS. So you will need to try it and see if it works for you without custom code in addition to the critical CSS.

Please see below to give you a better understanding of how web vitals works.
Most of the time a perfect score is impossible. This is because of the way elements load on the page.
Enfold is capable of a 90+ score. This is without critical CSS and without a CDN.

A CDN is only really needed if you have customers in multiple countries, or the actual server you have isnt very powerful so it uses the CDN to compensate for poor response times. Really, a CDN is designed to serve content from local servers to reduce server response times for global customers.

Critical CSS generators remove the render blocking warning and improve FCP and LCP in web vitals but can affect TBT scores negatively due to extra processing.

If you have added plugins that add extra front end elements then this will lower the performance score unless optimisation has been applied.

Hosting
The type of host you have will also depend on the plugins you need. If your host includes server side caching then you probably do not need a caching plugin at all. If your host has its own CDN like a dedicated wordpress host then this will also be cached serverside in most cases – So probably do not need a caching plugin.

Enfold on its own includes its own script merge function and some extra features that optimise wordpress itself (all in the performance panel) so the only things missing from the performance stack are Caching, Critical CSS and CDN.

If your server is a apache linux server you will need to add Gzip compression and cache control headers to the .htaccess file to remove these warnings. Most optimisation plugins can do this with one click setup.

If you want to reduce the size of your images you can use EWWW plugin to convert them to WebP. HOWEVER if your CDN uses Polish like Cloud Flares premium system it can be set to automatically convert and compress images. So depends on your setup and if your CDN includes image compression.

CDN and Font serving
A host like WPEngine automatically replaces URLs with the CDN URL once it is set up correctly. This includes fonts loaded via html/head.

If you added a third party CDN not provided by your web host – you will need to ensure that your DNS settings, any caching plugin and any CDN intergration plugin is configured properly to serve content via the CDN. So make sure you check the settings are correct.

Doing these last bits isn’t easy. You may find that removing the render blocking warning makes some of the other metrics worse.

I hope this helps!

• This reply was modified 3 years, 7 months ago by thinkjarvis.

@PabloCirre
Nice job on the site.
I see you have put in a workaround to prevent the background image loading on mobiles until the user interacts with the page.
I’d be really interested in a conversation with you about this.

The LCP score is the only part of Enfold that I have struggled to improve in Web Vitals. Currently between 0.1 and 2 seconds too high.

If you are able to share your solution in the forum and post a link here I’d really appreciate it.

Thanks,

Tom

Hi Thilo,
How long ago did you make your last round of changes.
Web vitals scores update every 28 days. So you probably need to leave things in their most optimised state for a while and see if you get a pass.

I just ran your site in chrome dev tools which is more consistent and saw a score of 97/100 for your site.

Do you use the built in Google fonts?
You could always download them and load them locally. You can then add pre-load rather than relying on Googles Font servers.
You could also try reducing the size of your background image it is over 4000px wide!
You could also try making your first element smaller.
I have a simillar issue on https://www.hemppureoils.co.uk. The design calls for a tall element above the fold. Meaning the LCP score is a little high.
This site has a slightly different setup which has lowered some of the other metrics in the process. Its a balancing act!

Difficult for me to comment further without knowing the state of the site without your optimisation plugins enabled.
Autoptimize and WP-Super Cache Disabled.

Hi Nancy,

If you set a site icon from Themes > Customize > Site Identity it overwrites the Enfold Favicon.

The WordPress site identity icon is 512pxx512px but if you set it – It is also used as the Favicon.

Can you check those settings?

I normally use a PNG 64×64 for the favicon upload via WordPress and then upload a 512×512 version in the site identiy panel.

Following this thread to see if support reveals anything or you come up with anything useful for minimizing the thread.

@thilo
Do you have script merging turned on? This will reduce the length of the thread because there are then less requests to the server?
Do you have any plugins installed to add extra front end features to the site?
what kind of hosting do you use:
Is it NGINX/dedicated wordpress or just a standard Apache server?

Regarding the length of the main threadwork question – Have you got any other warnings or recommendations in web vitals?
I have just short of 50 Enfold Installs running – All of which will pass web vitals with a score of 90+ with some updates I am rolling out at the moment.

Recent example: https://www.harrisongardenservices.co.uk/

Just remember that web vitals uses realworld data to determine a pass/fail score. Generally speaking – a site with a score as low as 50/100 can still pass – Depending on what kind of devices the site visitors use.
So at between 70 – 80 out of 100 you may already be achieving a pass mark for a majority of users.
I tend to find the LCP score for Enfold sites is about 0.1 – 0.5 seconds above a green score but the real world data shows a pass.

Can you try creating a new slider on a test page to see if there is an error with the current element?
Use the same images and see if it works?

I appologise I have given you wrong information.

I was refering to Lazy load I forgot that Srcset is controlled globally.

You only need to turn on the setting in the theme control panel.

Enfold > Performance >

Note that it will only work if you have appropriate image sizes for it to downsize to.

• This reply was modified 3 years, 8 months ago by thinkjarvis.