Updated on 18 Dec 2023
A defer setting is now available starting with v1.9.178 of WS Form. You might want to toggle that on, especially for new installs. For existing installs, exercise caution and ensure that no functionality is broken.
There is no need to implement this tutorial.
As of version 1.9.177, WS Form (tested the PRO version) does not add a defer attribute to its scripts ws-form.min.js and ws-form-public.min.js that load in the header. This will result in these scripts causing render-blocking.
The plugin does not even load its scripts in the footer (the next best course of action) out of the box, at the very least. The reason cited is apparently to ensure compatibility with performance plugins.
Performance should be the responsibility of individual plugins and not be deferred (pun intended) to other plugins that most users do not use.
A setting to add the defer attribute might be coming in an update to WS Form, but it won’t likely be the default.
Until then, we can fix the situation by adding this code in the child theme’s functions.php (might also work in a code snippets plugin, but we have not tested it):
/**
* Filter the HTML script tag of listed (by their handles) scripts to add `defer` attribute.
*
* @param string $tag The <script> tag for the enqueued script.
* @param string $handle The script's registered handle.
* @param string $src The script’s source URL.
*
* @return Filtered HTML script tag.
*/
add_filter( 'script_loader_tag', function( $tag, $handle, $src ) {
// if we are in WP admin, abort.
if ( is_admin() ) {
return $tag;
}
$handles = [
'ws-form-form-common',
'ws-form-form-public',
'ws-form-analytics',
'ws-form-select',
'ws-form-tracking',
'ws-form-conditional'
];
if ( in_array( $handle, $handles) ) {
$tag = str_replace( ' src', ' defer src', $tag );
}
return $tag;
}, 10, 3 );After:
Note: If you use a plugin that relies on WS Form, you are advised to test if all the functionality of your forms is still intact after adding the defer attribute.
9 comments
Mark Westguard
Per our discussion prior to this article being written, this code will be unnecessary in the next version of WS Form. There will be a simple checkbox in global settings to enable defer on scripts should you wish.
This will intentionally not be enabled by default so as not to affect existing customer forms. We prefer opt in on most features as opposed to opt out.
Many thanks for the suggestion.
Mark
Allen Stone
Thanks, Mark! Looking forward to it.
Sridhar Katakam
Mark added it in v1.9.178.
Allen Stone
Quick followup, the form builder doesn't load when this is active. Happens whether using functions.php or a code snippet plugin.
Sridhar Katakam
Fixed.
Allen Stone
Confirmed working using WPCodeBox 2.
Also, there are additional WSForm scripts that can be deferred depending on what features you have enabled. Additional handles to check:
• ws-form-analytics
• ws-form-select
• ws-form-tracking
• ws-form-conditional
There may be more. Those are the ones I immediately saw based on our current usage.
Mark Westguard
I would not recommend using this script. Wait for the official defer functionality in the next version of WS Form. This script misses a significant number of potential scripts that can be enqueued.
Sridhar Katakam
Updated to add a line to not implement this method.
Sridhar Katakam
Updated, ty.