• Home
  • Archive
  • Tools
  • Contact Us

The Customize Windows

Technology Journal

  • Cloud Computing
  • Computer
  • Digital Photography
  • Windows 7
  • Archive
  • Cloud Computing
  • Virtualization
  • Computer and Internet
  • Digital Photography
  • Android
  • Sysadmin
  • Electronics
  • Big Data
  • Virtualization
  • Downloads
  • Web Development
  • Apple
  • Android
Advertisement
You are here: Home » Defer Parsing of Javascript in WordPress : Snippets and Plugins

By Abhishek Ghosh April 4, 2014 5:42 am Updated on October 14, 2016

Defer Parsing of Javascript in WordPress : Snippets and Plugins

Advertisement

Defer Parsing of Javascript in WordPress to Increase PageSpeed Score, with Snippets, You can Customize For Your Own WordPress Installation. Most of us have various Javascript which are necessary plugins for our specific WordPress domains, and we know where in the php file it is taking the origin. We are talking about a measure which we can take to speed up page loading times, and pass every speed test on the web that says to defer Javascripts if possible. We are not using W3 Total Cache but we are using Redis for WordPress.

Update on 14th Oct, 2016.

Quick info on Defer Parsing of Javascript in WordPress:

This is non-blocking way for individual CSS :

Vim
1
<link rel="stylesheet" href="https://cdn.domain.com/my.css" media="none" onload="if(media!='all')media='all'">

Why, that is explained in How to Load CSS Without Blocking Rendering.

This is non-blocking way for individual Js :

Vim
1
<script type='text/javascript' src='https://cdn.domain.com/my.js' async defer>execOnReady(function(){execOnReady(function(){});});</script>

 

Defer Parsing of Javascript in WordPress : Basics

 

Probably you have read about the defer=’defer’ and the async functions in javascript and but most don’t understand how defer parsing of Javascript in WordPress can be realized.

Those who are looking for some plugins to solve the issue; we will suggest to read our previous guide – Eliminate Render-blocking Javascript and CSS WordPress Reloaded and Older version of the article on the same topic – Eliminate Render-blocking Javascript and CSS. This will cover over 80% of the nomad users with a custom theme with or without much complexity. So, Plugins part is done; you can read the older articles and install the Plugin. Now we will come towards the snippet part.

Advertisement

---

 

Defer Parsing of Javascript in WordPress : Snippets

 

Defer parsing of Javascript in WordPress via plugin, in many cases is not possible to actualize because of various reasons.
wp_print_scripts() calls WP_Scripts->do_items() ; WP_Scripts->do_item() uses esc_url()which does offer a filter named clean_url.

Defer Parsing of Javascript in WordPress

So, we can actually write a small Plugin only for one (or multiple) known other Plugin which is inserting the Javascript from Theme’s functions.php (or whatever) file :

Vim
1
2
3
4
5
6
7
8
9
add_filter( 'clean_url', function( $url )
{
    if ( FALSE === strpos( $url, '.js' ) )
    { // not our file
        return $url;
    }
    // Must be a ', not "!
    return "$url' defer='defer";
}, 15, 5 );

This is one way, specially useful if you target one Javascript. Here is a kind of Plugin out of this method.

An universal way from Theme’s functions.php will be :

Vim
1
2
3
4
5
6
7
8
9
10
function add_async_forscript($url)
{
    if (strpos($url, '#asyncload')===false)
        return $url;
    else if (is_admin())
        return str_replace('#asyncload', '', $url);
    else
        return str_replace('#asyncload', '', $url)."' async='async";
}
add_filter('clean_url', 'add_async_forscript', 11, 1);

We actually can async with wp_enqueue_script ( read here for reference and here for using with Rackspace Cloud Files ) too :

Vim
1
wp_enqueue_script('dcsnt', '/path/to/go/javascript-name.min.js#asyncload' )

Let us clean it to full working thing :

Vim
1
2
3
4
5
6
7
8
9
10
11
wp_register_script( 'menu', get_template_directory_uri() . '/js/script.js?defer', array('query'), '1.0', true );
if ( FALSE === strpos( $url, '.js?defer' ))
add_filter( 'clean_url', function( $url )
{
    if ( FALSE === strpos( $url, '.js?defer' ) )
    { // not our file
    return $url;
    }
    // Must be a ', not "!
    return "$url' defer='defer";
}, 11, 1 );

Another method is by using Javascript function, which is already written by Brian :

Vim
1
http://www.designerzblog.com/2013/12/speedup-wordpressite-load-javascript-asynchronisely.html

Tagged With Defer parsing of JavaScript , Defer parsing of JavaScript wp , Defer parsing JavaScript plugins wordpress , how to Defer Parsing of Javascript in WordPress , Deferre JavaScripts wordpress plugin , DEFER PARSING OF JAVASCRIPT WORDRESS , defer parsing of javascript wordpress plugin , defer parsing of javascript wordpress , defer parsing of javascript without using a WordPress plugin , wordpress plugin to defer parsing of javascript

This Article Has Been Shared 604 Times!

Facebook Twitter Pinterest

Abhishek Ghosh

About Abhishek Ghosh

Abhishek Ghosh is a Businessman, Surgeon, Author and Blogger. You can keep touch with him on Twitter - @AbhishekCTRL.

Here’s what we’ve got for you which might like :

Articles Related to Defer Parsing of Javascript in WordPress : Snippets and Plugins

  • Cloud Computing and Virtualization : Hardware Requirements

    Cloud Computing and Virtualization has specific hardware requirements. Trends are changing and various companies are offering tailored hardwares.

  • Dropbox Cloud Storage : Turning 360 Degree Towards Social Network

    Dropbox Cloud Storage changing their strategies is nothing new news. With huge user base, Dropbox Cloud Storage is shifting slowly towards a different model. We previously wrote about the Dedicated Music Service by Dropbox Cloud. Last week a new feature for Dropbox Cloud Storage added the feature of online preview of the documents placed inside […]

  • How to set VNC up on A Linux Server With Rackspace Cloud

    How to set VNC up on a Linux Server with Rackspace Cloud Unmanaged Server plus tips on suitable Linux distro, which clients to use – all in one compact article.

  • TLS False Start : Exactly How to Get With Nginx

    TLS False Start on Nginx Appears Black Magic to Many New Server Admins. Here is How to Exactly How to Get it With Nginx in Easy Language.

  • Easy Steps To Setup Let’s Encrypt on Ubuntu 16.04, Nginx

    Here Are Easy Steps To Setup Let’s Encrypt on Ubuntu 16.04, Nginx With HSTS, ALPN on HTTP/2, OCSP Stapling, Public Key Pinning (HPKP), Cipher.

Additionally, performing a search on this website can help you. Also, we have YouTube Videos.

Take The Conversation Further ...

We'd love to know your thoughts on this article.
Meet the Author over on Twitter to join the conversation right now!

If you want to Advertise on our Article or want a Sponsored Article, you are invited to Contact us.

Contact Us

Subscribe To Our Free Newsletter

Get new posts by email:

Please Confirm the Subscription When Approval Email Will Arrive in Your Email Inbox as Second Step.

Search this website…

 

Popular Articles

Our Homepage is best place to find popular articles!

Here Are Some Good to Read Articles :

  • Cloud Computing Service Models
  • What is Cloud Computing?
  • Cloud Computing and Social Networks in Mobile Space
  • ARM Processor Architecture
  • What Camera Mode to Choose
  • Indispensable MySQL queries for custom fields in WordPress
  • Windows 7 Speech Recognition Scripting Related Tutorials

Social Networks

  • Pinterest (24.3K Followers)
  • Twitter (5.8k Followers)
  • Facebook (5.7k Followers)
  • LinkedIn (3.7k Followers)
  • YouTube (1.3k Followers)
  • GitHub (Repository)
  • GitHub (Gists)
Looking to publish sponsored article on our website?

Contact us

Recent Posts

  • What is ChatGPT? February 3, 2023
  • Zebronics Pixaplay 16 : Entry Level Movie Projector Review February 2, 2023
  • What is Voice User Interface (VUI) January 31, 2023
  • Proxy Server: Design Pattern in Programming January 30, 2023
  • Cyberpunk Aesthetics: What’s in it Special January 27, 2023

About This Article

Cite this article as: Abhishek Ghosh, "Defer Parsing of Javascript in WordPress : Snippets and Plugins," in The Customize Windows, April 4, 2014, February 5, 2023, https://thecustomizewindows.com/2014/04/defer-parsing-javascript-wordpress-snippets-plugins/.

Source:The Customize Windows, JiMA.in

PC users can consult Corrine Chorney for Security.

Want to know more about us? Read Notability and Mentions & Our Setup.

Copyright © 2023 - The Customize Windows | dESIGNed by The Customize Windows

Copyright  · Privacy Policy  · Advertising Policy  · Terms of Service  · Refund Policy

We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept”, you consent to the use of ALL the cookies.
Do not sell my personal information.
Cookie SettingsAccept
Manage consent

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Always Enabled
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
CookieDurationDescription
cookielawinfo-checkbox-analytics11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional11 monthsThe cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytics
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
Others
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
SAVE & ACCEPT