Deferring Javascript without Breaking Gravity Forms?

I recently noticed that turning on my caching plugin’s Defer JS option, I broke all non-logged-in users from seeing the forms.

What scripts from Gravity forms should I try excluding from the JS deferral to see if I can have the benefits of deferring JS without breaking the Forms?

FYI, I only noticed these breaking yesterday/today when I updated my plugins and updated to WP 5.5.

1 Like

Our development team is aware of the interest in loading scripts in the footer. We did make some changes, still in experimental phase, and they seem to be working fine in our testing but we still need feedback from users. If you want to give it a try just copy/paste the following snippet: https://d.pr/n/vK8iRS

PHP code usually goes in your theme functions.php file or a custom functionality plugin. Check the following link for more details about where to place that code: https://docs.gravityforms.com/where-do-i-put-this-code/#php

To prevent losing your snippet in case of a theme update, be sure you are using a child theme.

IMPORTANT : Gravity Forms 2.5 (which is in beta release now) is planned to have full support for this without using the above snippets. In fact you will need to remove the snippets before upgrading to 2.5 when available. Please keep that in mind if you decide to use this snippet with Gravity Forms 2.4.20 or anything before Gravity Forms 2.5.

If you have any other questions, please let us know.

2 Likes

Very nice. Looks like 50% of this recaptcha-specific, so if we don’t use it on the forms, can just eliminate that code?

Hi Leho. It’s worth a try :slight_smile: I believe that will work. If you try it, please let us know how it goes and where there is room for improvement. This will be different in 2.5, but if you want a fix for a production site, this is worth a try.

Was wondering if there is any update on this. It is critical js is loaded in the footer. Would be great if there was an option for this as doing it in functions.php is not the best way.

This feature should be included in version 2.5, which is in beta now. I recommend giving the beta a look to see if it meets your needs. The beta is available from your downloads page: https://www.gravityforms.com/my-account/downloads/ If you decide to try that, please do so on a test or staging site, not your live site.

We do not have a time frame for the 2.5 final release at this time. Thank you for your question.

Thanks Chris, look forward to the rellease.

1 Like

I implemented the code above at https://d.pr/n/vK8iRS
and then I found that it breaks the Cumulative Layout Shift as part of Lighthouse.
I’m using GeneratePress Pro and WP Rocket.
But gravity forms either has jquery not defined or CLS above 1.

2 Likes

Anyone using one of these code methods to defer loading of jQuery in Gravity Forms will need to remove their code, as the Gravity Forms scripts are now loaded with the defer attributes (most of them, but not all.)

If you have any trouble, please let us know via a support ticket:

It would be best if Gravity Forms just dropped jQuery for the front end all together. Many libraries are dropping it now in favor of plain Javascript. This would be great as I no longer use jQuery for my websites, but I have to if I am using Gravity Forms.