admin管理员组文章数量:1130349
In my website, I used GTmetrix and I got JS defer error on following two files.
92.5KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.
/wp-includes/js/jquery/jquery.js?ver=1.12.4 (87.0KiB)
/ (5.5KiB of inline JavaScript)
In my functions.php file I have following code to defer js but it seems not affected for js file(s) outside the theme folder.
Here's my piece of code in functions.php file
if (!(is_admin() )) {
function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, '.js' ) ) return $url;
if ( strpos( $url, 'jquery.js' ) ) return $url;
// return "$url' defer ";
return "$url' defer onload='";
}
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}
How can I get rid of that error and defer parsing above mentioned items?
In my website, I used GTmetrix and I got JS defer error on following two files.
92.5KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.
http://mysite.url/wp-includes/js/jquery/jquery.js?ver=1.12.4 (87.0KiB)
http://mysite.url/ (5.5KiB of inline JavaScript)
In my functions.php file I have following code to defer js but it seems not affected for js file(s) outside the theme folder.
Here's my piece of code in functions.php file
if (!(is_admin() )) {
function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, '.js' ) ) return $url;
if ( strpos( $url, 'jquery.js' ) ) return $url;
// return "$url' defer ";
return "$url' defer onload='";
}
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}
How can I get rid of that error and defer parsing above mentioned items?
Share Improve this question edited Jun 15, 2020 at 8:21 CommunityBot 1 asked Dec 19, 2018 at 7:06 VishwaVishwa 3762 silver badges17 bronze badges 01 Answer
Reset to default 1What Are Async And Defer Attributes?
Here's what the async and defer attributes do:
Async Attribute: The async attribute loads the script asynchronously. In other words, ensures that the script loads asynchronously along side the other contents of the page, after which it is executed.
Defer Attribute: The defer attribute defers loading of the script. It ensures that the script is executed only after all contents of the page have finished loading.
Both these attributes are well supported in all modern browsers including Firefox, Chrome and Internet explorer. Internet explorer has added support for these attribute since IE10.
An example of a script tag with the async and defer attributes is as follows:
<script src='http://sitename/js/scripts.js' async='async' type='text/javascript'>
</script>
<script src='http://sitename/js/scripts.js' defer='defer' type='text/javascript'>
</script>
Function To Add 'Async/Defer' Attribute To Your Render Blocking Scripts In this article, we are going to look at three different methods to add these attributes to your render blocking javascripts. These methods are as follows:
Method 1: Adding defer/async to all scripts without exception. Method 2: Adding defer/async to all scripts with exception of a few. Method 3: Adding defer/async only to selective scripts. (Most flexible method as it allows you to add async to some scripts and defer to others.) You can use any method that suits your need. You can use any method that suits your need.
Method 1: Adding Async or Defer to All Scripts
If you would like to add the async or defer attribute to all scripts without exception then you can use the following code.
Open your theme's functions.php page and add this code to the bottom of the page.
/*function to add async to all scripts*/
function js_async_attr($tag){
# Add async to all remaining scripts
return str_replace( ' src', ' async="async" src', $tag );
}
add_filter( 'script_loader_tag', 'js_async_attr', 10 );
for additional information please check link https://orbitingweb/blog/add-defer-async-attributes-to-scripts-in-wordpress/
In my website, I used GTmetrix and I got JS defer error on following two files.
92.5KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.
/wp-includes/js/jquery/jquery.js?ver=1.12.4 (87.0KiB)
/ (5.5KiB of inline JavaScript)
In my functions.php file I have following code to defer js but it seems not affected for js file(s) outside the theme folder.
Here's my piece of code in functions.php file
if (!(is_admin() )) {
function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, '.js' ) ) return $url;
if ( strpos( $url, 'jquery.js' ) ) return $url;
// return "$url' defer ";
return "$url' defer onload='";
}
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}
How can I get rid of that error and defer parsing above mentioned items?
In my website, I used GTmetrix and I got JS defer error on following two files.
92.5KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.
http://mysite.url/wp-includes/js/jquery/jquery.js?ver=1.12.4 (87.0KiB)
http://mysite.url/ (5.5KiB of inline JavaScript)
In my functions.php file I have following code to defer js but it seems not affected for js file(s) outside the theme folder.
Here's my piece of code in functions.php file
if (!(is_admin() )) {
function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, '.js' ) ) return $url;
if ( strpos( $url, 'jquery.js' ) ) return $url;
// return "$url' defer ";
return "$url' defer onload='";
}
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );
}
How can I get rid of that error and defer parsing above mentioned items?
Share Improve this question edited Jun 15, 2020 at 8:21 CommunityBot 1 asked Dec 19, 2018 at 7:06 VishwaVishwa 3762 silver badges17 bronze badges 01 Answer
Reset to default 1What Are Async And Defer Attributes?
Here's what the async and defer attributes do:
Async Attribute: The async attribute loads the script asynchronously. In other words, ensures that the script loads asynchronously along side the other contents of the page, after which it is executed.
Defer Attribute: The defer attribute defers loading of the script. It ensures that the script is executed only after all contents of the page have finished loading.
Both these attributes are well supported in all modern browsers including Firefox, Chrome and Internet explorer. Internet explorer has added support for these attribute since IE10.
An example of a script tag with the async and defer attributes is as follows:
<script src='http://sitename/js/scripts.js' async='async' type='text/javascript'>
</script>
<script src='http://sitename/js/scripts.js' defer='defer' type='text/javascript'>
</script>
Function To Add 'Async/Defer' Attribute To Your Render Blocking Scripts In this article, we are going to look at three different methods to add these attributes to your render blocking javascripts. These methods are as follows:
Method 1: Adding defer/async to all scripts without exception. Method 2: Adding defer/async to all scripts with exception of a few. Method 3: Adding defer/async only to selective scripts. (Most flexible method as it allows you to add async to some scripts and defer to others.) You can use any method that suits your need. You can use any method that suits your need.
Method 1: Adding Async or Defer to All Scripts
If you would like to add the async or defer attribute to all scripts without exception then you can use the following code.
Open your theme's functions.php page and add this code to the bottom of the page.
/*function to add async to all scripts*/
function js_async_attr($tag){
# Add async to all remaining scripts
return str_replace( ' src', ' async="async" src', $tag );
}
add_filter( 'script_loader_tag', 'js_async_attr', 10 );
for additional information please check link https://orbitingweb/blog/add-defer-async-attributes-to-scripts-in-wordpress/
本文标签： customizationHow can I defer these JS files
版权声明：本文标题：customization - How can I defer these JS files? 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://it.en369.cn/questions/1749062928a2310380.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论