Remove Render-Blocking JavaScripts

Your page has 5 blocking script resources and 5 blocking CSS resources. This causes a delay in rendering your page.

https://maps.googleapis.com/
https://maps.gstatic.com/maps-api-v3/.....js
https://maps.gstatic.com/maps-api-v3/.....js
Rest two js are internal js

http://fonts.googleapis.com/css?family=Roboto:400,300,500,700

Rest 4 are internal css in minimized format and are saved above <body> .
Even if maps.... js and fonts.googleapis are saved  after </body> tags  o/p of the page speed remains the same.
LVL 15
InsoftserviceAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Alexandre SimõesManager / Technology SpecialistCommented:
Try to use the defer attribute in your script tag.
<script src="https://maps.googleapis.com/"></script>
<script defer src="https://maps.gstatic.com/maps-api-v3/.....js"></script>
<script defer src="https://maps.gstatic.com/maps-api-v3/.....js"></script>

Open in new window


The defer attribute will tell the script tag to load the file in parallel with the HTML parsing and only execute it at the end of the HTML parser execution.
You can read more about defer and async here.

If this still doesn't help, you have to load your script manually via AJAX call.
Tell me how it goes.
0
InsoftserviceAuthor Commented:
Thx for the comments please do let me know is there some mechanism to check on local m/c.
As when i tried on jquery (for testing purpose)
<script async  type="text/javascript" src="/js/jquery.min.js?c=1"></script>.
It gives error "ReferenceError: jQuery is not defined" . so will it not affect other js part
0
Alexandre SimõesManager / Technology SpecialistCommented:
Wth jquery you can't do that.
Also notice that in my code sample I also didn't add it to the maps.googleapis.com reference.

There's a reason why script blocks are blocking tasks, it's the only way you can actually create dependencies between scripts. For example, if in your scripts you use jQuery, you know that jQuery have to be included before your script right?

With Async and Defer all this is gone. Scripts load execute with no specific order.
In case of async is even "worse" because they execute as soon as they are downloaded.
This means that all global related scripts (like jquery or google api) still need to be loaded without any of these annotations and before all the other ones that need them.
It's not a big issue because they don't perform any real action, so it's just the loading time of the file itself that can affect the performance, but even then, browser cache will give you an hand on that.

So in your case I think defer is more appropriate because async still blocks the HTML rendering, while defer scripts only get executed once the whole HTML is parsed.
But use it only on stand alone script files, not on files that may be required by others.

I hope I made myself clear :)
If not, feel free to ask!

Cheers!
1

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
InsoftserviceAuthor Commented:
Thx it really helped.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.