Eliminate render-blocking JavaScript and CSS

Hi geeks,

I have been trying to speed up one of my latest website www.spicytrendz.in using google speed test
https://developers.google.com/speed/...2F&tab=desktop

if you go to the above url you will see google suggestion to fix blocking JavaScript and CSS on page load.

I have tried quite a few things but failed. one of the link I found in this link
http://magento.stackexchange.com/que...the-fold-conte

saying add <action method="addJs"><script>prototype/prototype.js</script><params>async</params></action> in app\design\frontend\base\default\layout\page.xml

in my page.xml I can see the below entry:
<block type="page/html_head" name="head" as="head">
<action method="addJs"><script>prototype/prototype.js</script></action>
<action method="addJs"><script>mage/translate.js</script></action>
<action method="addJs"><script>lib/ccard.js</script></action>
<action method="addJs"><script>prototype/validation.js</script></action>
<action method="addJs"><script>varien/js.js</script></action>

<action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
<action method="addItem"><type>skin_css</type><name>css/styles-ie.css</name><params/><if>lt IE 8</if></action>
<action method="addCss"><stylesheet>css/widgets.css</stylesheet></action>
<action method="addCss"><stylesheet>css/print.css</stylesheet><params>media="print"</params></action>

<action method="addItem"><type>js</type><name>lib/ds-sleight.js</name><params/><if>lt IE 7</if></action>
<action method="addItem"><type>skin_js</type><name>js/ie6.js</name><params/><if>lt IE 7</if></action>

</block>

I am not sure what the about code is doing. Can some one please tell me if there is any way I can call all my css and js on page load. Thank you for looking into this.

warm regards,
Saif

Hello,
the stack-exchange link you have followed is showing the example of real process. In your case, you need to the same with following extension file.
1. magestore/bannerslider/jquery-1.7.min.js
2. magestore/bannerslider/jquery.flexslider.js

Both these files are from the extension of bannerslider. So you need to check layout file of this extension.

How should I load these Js file asynchronously ?

bannerslider/jquery-1.7.min.js
/bannerslider/jquery.flexslider.js

I am not sure where is the .xml file like page.xml where we can add a code <params>async</params> which load these file asynchronously.
I have a related blocking css file too. I have no idea how to make this work. Any help is appreciated... Thanks a lot.

Go to Performance -> General Settings.
You will see a few options under this heading.
In the Minify mode option, choose Manual, and then click Save all settings button.
At this point, you must fetch all the JS and CSS scripts causing render-blocking.