3

I have been trying to speed up one of my latest website www.spicytrendz.in using google speed test speed test result

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 I solve Remove render-blocking JavaScript issue

saying add prototype/prototype.jsasync 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 above 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

  • Agree, OP please edit if linked thread does not provide the answer. – benmarks Jul 2 '16 at 13:34
1

Open file page.xml at location app\design\frontend\default\{your_theme}\layout\ (I think your theme pagayo-theme-002)

After find code <action method="addJs"><script>prototype/prototype.js</script></action> in above file page.xml

Reaplce code from

<action method="addJs"><script>prototype/prototype.js</script></action>

to

<action method="addJs"><script>prototype/prototype.js</script><params>defer</params></action>  
<action method="addJs"><script>prototype/prototype.js</script><params>async</params></action>

Note : Clear all cache in admin site

  • Hi Abdul, thanks for taking time to answer. Can you please explain what "defer" and "async" does ? Yesterday I used just "async" againt all the .js and .css in page.xml and found out that checkout of product was't working. Does some .js need to be loaded before page load? Thanks for you time. If this work I can increase the page load time. – HackSaif Jul 3 '16 at 14:13
  • It doent work.... Any one has any Idea how can I load below two Js file Asynchronously? bannerslider/jquery.flexslider.js bannerslider/jquery-1.7.min.js thanks – HackSaif Aug 27 '16 at 18:03

Not the answer you're looking for? Browse other questions tagged or ask your own question.