I'm trying to optimize my Magento 1.9.3 website, following Google PageSpeed hints, saying I have js and css that load synchrounously and block the page rendering.
To solve this issue, I'm putting all the javascript files with async loading, as advised in this answer.
So all my loaded scripts looks like this:
<action method="addItem"><type>skin_js</type><name>js/jquery.fancybox.2.1.5.min.js</name><params>defer</params></action>
<action method="addItem"><type>skin_js</type><name>js/jquery.fancybox.2.1.5.min.js</name><params>async</params></action>
This way, running PageSpeed again, gives better results.
The problem is that I get plenty of javascript exceptions, because probably the scripts that are inside templates files (.phtml), load before the script has been loaded. This is worse, if I clear the browser cache and reload the page. I've also tried an external module, pagespeed, but it also gives no better result on PageSpeed. I've read other questions like this, for the best practices, but still don't get what is the best way to solve this "problem".
I mean, selecting which scripts should be loaded before the html, in order to make the 'above-the-fold' content to be working, seems crazy, but I also would not like to ignore PageSpeed Insights.
Any suggestion? Thank you in advance.
EDIT Actually the extension I've installed works pretty well even though it is causing some problems with my css. Any chance to make things work WITHOUT any extension?