This one small hack is going to do wonders for your page speed and the resulting experience provided to website users.
The JavaScript scripting language is used everywhere on the Web, including in just over 90 percent of the top 100,000 sites according to Quantcast data as reported by BuiltWith. And at the library level, jQuery , with its fast, concise approach to traversing HTML documents, handling events, performing animations, and adding Ajax interactions to Web pages, has become the predominant library in use today.
The problem is that webmasters and developers are implementing jQuery in ways that essentially slow the rendering of Web pages as using a JavaScript library almost always means including a "call" to retrieve the file itself (unless you're going to inline it).
Since search engines now take into account the user experience provided (as page rendering time is a factor) when determining rank or position on the results list it is important to concentrate on taking advantage of methods that accelerate the Web experience and there's a really, really easy way to get around the problem of render blocking JavaScript - you can leverage the async method.
In the simplest explanation, when a browser executes something synchronously, it must wait to finish before moving on to another task. When the browser executes something asynchronously, however, it is possible to move on to another task before it finishes. See where are we going with this? What if there was a way to load these elements asynchronously instead of synchronously? Guess what? There is!
How can you take advantage of the async method? Simple, first run your website through Google's Page Speed Insight tool. If you receive the indication/notification that the site is blocking the rendering of Javascript, identify which file is causing the problem, and then open the file that makes the call (that may be an index file for example).