How To Optimize External JavaScript File For Better Loading?

As you know that Javascript /Jquery files are well known about there loading time and slowing down your web speed. So its time to make this phenomena reverse and make it load fast so that it will not effect on your page load time. Through using this code, you will also get “Eliminate Or Remove Render-Blocking External JavaScripts” error from your blog too so we suggest everyone to use this code.

Before a browser can render a page to the user, it has to parse the page. If it encounters a blocking external script during parsing, it has to stop and download that Javascript. Each time it does that, it is adding a network round trip, which will delay the time to first render of the page. Using asynchronous scripts means that your page can render more quickly. Instead of forcing users to wait for a script to finish downloading before the page renders, a script can be downloaded in the background. Although most scripts were originally synchronous, newer versions of the scripts have been designed to load asynchronously.JavaScript needed to render the above-the-fold region should be inlined, and JavaScript needed to add additional functionality to the page should be deferred until after the above-the-fold content has been delivered.

Some Top Sites Are Using This Code:

Make sure you are using the asyncrhonous version of your script. The following popular scripts support asynchronous script loading:

• BuySellAds (s3.buysellads.com/ac/bsa.js) : blog post – async by default
• ChartBeat (static.chartbeat.com/js/chartbeat.js) : doc, blog post – async by default
• Clicky (static.getclicky.com/js) : blog post
• Disqus (disqus.com/count.js, disqus.com/embed.js) : doc, blog post – async by default
• Facebook (connect.facebook.net/…/all.js) : doc, blog post – async by default
• Google AdSense (pagead2.googlesyndication.com/pagead/show_ads.js) : doc, blog post
• Google Analytics (google-analytics.com/ga.js) : doc, blog post – async by default
• Google DFP GPT (www.googletagservices.com/tag/js/gpt.js) : doc
• Google Plus (apis.google.com/js/plusone.js) : doc, blog post
• New Relic (d7p9czrvs14ne.cloudfront.net/11/eum/rum.js) : doc – async by default
• Pinterest (assets.pinterest.com/js/pinit.js) : doc
• Shareaholic : doc – async by default
• ShareThis (w.sharethis.com/button/buttons.js) : doc
• ScorecardResearch/Comscore (b.scorecardresearch.com/beacon.js) : doc – async by default
• StumbleUpon (platform.stumbleupon.com/…/widgets.js)
• Quantcast (quantserve.com/quant.js) : doc – async by default
• Twitter (platform.twitter.com/widgets.js) : doc – async by default
• Tynt (cdn.tynt.com/tc.js)
• Yandex (mc.yandex.ru/metrika/watch.js)

How To Optimize External JavaScript?

Step 1:) Find external JavaScript files on your web page.
<script type="text/javascript" src="https://www.example.com/scripts/javascript.js">

Step 2:) Now add async="" to external JavaScript files.
<script type="text/javascript" async="" src="https://www.example.com/scripts/javascript.js">
Ste 3:) Save and done.

Important Note:

If your JavaScript resources use document.write, it is not safe to use asynchronous loading. Many script still not support this so add this code and check your web that that one script is working or not. If not working then remove it.

Last Words:

This is what we have and shared in easy steps for newbies so that they can easily know how it works. Stay with us because we are going to share a whole guide step by step about WordPress and make it easy for you. If you liked it then share it and be with us to get next tutorial. If you have any problem then feel free to ask us. We will help you with what we can or have.