I am running magento 1.9, and I am using the RWD slider that comes with Magento 1.9 on the home page.

Google's PageSpeed doesn't like this and says:

Eliminate render-blocking JavaScript and CSS in above-the-fold content

How can I do it for this java script file which calls the slider:


4 Answers 4


I solve Remove render-blocking JavaScript issue on Magento-1.9.x as follows:

<script src="filename.js"></script>
Replace with Following:  
<script src="filename.js" defer></script>
<script src="filename.js" async="async"></script>


<action method="addJs"><script>prototype/prototype.js</script></action>  
Replace with Following:  
<action method="addJs"><script>prototype/prototype.js</script><params>defer</params></action>  
<action method="addJs"><script>prototype/prototype.js</script><params>async</params></action>

hints: it may locate on base theme

app\design\frontend\base\default\layout\page.xml about line:38,

If you use active theme different path ex for rwd as app\design\frontend\base\default\layout\page.xml

  • Where do you add that? in which magento xml file?
    – styzzz
    Commented Jul 15, 2015 at 22:14
  • @styzzz ,yes and also header /footer file .its better to find google suggested blocked js
    – matinict
    Commented Jul 21, 2015 at 6:09
  • @styzz it locate on base theme app\design\frontend\base\default\layout\page.xml about line:38,. If you use active theme different path ex for rwd as app\design\frontend\base\default\layout\page.xml
    – matinict
    Commented Mar 8, 2016 at 5:19
  • 1
    I followed you. It solve the issue in Google page insight but it is giving many errors in Console in Google chrome Commented Jul 11, 2016 at 17:15
  • @MDSHOEBMIRZA then it did not solve the issue
    – tread
    Commented Aug 25, 2016 at 11:18

The technique as described by "Mohan Gs" will not work here.

Because of the js path /media/js/ it seems he uses js merging. That means, that all js files added by xml standard way

  • <action method="addJs">...
  • <action method="addItem"><type>js</type>..

will be merged in a big one to /media/js/<hash>.js.

Magento core js files are added

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

this way, too.

There are also many templates using inline js, wich depends on objects/functions that are defined by the head js files.

At this point, is it not enough to move only the head js files to the bottom. You have to move all inline js declarations after the head js and before </body> too.

In all/many cases it is impossible to separate inline js from the templates because they are using template specific variables.

You can only use a general method like parsing the final html and move this things together and in correct order.

So have a look at the extension Pagespeed.

  • Im sorry - I still cant figure out what to do. Which file should I be editing? Are you saying we should edit the XML files and move the line that calls the JS to a different section? I can edit the XML file, but I am unsure which one, and where to move the line that called the JS script. Please let me know.
    – styzzz
    Commented May 22, 2015 at 19:55
  • My answer should explain, that you can not move the javascript xml calls to a different section. This will lead to errors. You can try the mentioned extension. Commented Jun 8, 2015 at 16:56
  • Hi Steven, I tried your module. Nothing changed. No javascript or css were moved. Also the admin end Pagespeed configuration is showing 404
    – Sandeep
    Commented Jun 24, 2015 at 6:33
  • @Sandeep: This is not the place for your comment. Please create a detailed report/issue at github. Commented Jun 25, 2015 at 7:13

This code says wait for the entire document to load, then load the external file defer.js.

<script type="text/javascript">
    function downloadJSAtOnload() {
        var element = document.createElement("script");
        element.src = "defer.js";
    if (window.addEventListener)
        window.addEventListener("load", downloadJSAtOnload, false);
    else if (window.attachEvent)
        window.attachEvent("onload", downloadJSAtOnload);
    else window.onload = downloadJSAtOnload;

These are the steps that you need to follow.

  1. Copy above code.

  2. Paste code in your HTML just before the </body> tag (near the bottom of your HTML file).

  3. Change the defer.js to the name of your external JS file.

  4. Ensure the path to your file is correct. Example: if you just put defer.js, then the file defer.js must be in the same folder as your HTML file.

For more details, Refer This Article


Here is open source extension to solve that https://github.com/mediarox/pagespeed

Current features

  • Move all Javascript tags (head & inline) to the bottom. ({stripped_html}{js})
  • including conditional js units ({multiple js tags})
  • including external js tags including "inline" js tags
  • Move all CSS tags (head & inline) to the bottom. ({stripped_html}{css})
  • including conditional css units ({multiple css tags})
  • including external css tags
  • including inline css tags


From Magento 1.5.x to Magento 1.9.x .

Backend Configuration

All modules (Pagespeed_Js, Pagespeed_Css) are disabled by default.

Configuration path: System > Configuration > ADVANCED > Pagespeed

How it works ?

Simple parse the final html stream on the event "controller_front_send_response_before".

  • Went over to GitHub and found that the script was last updated on 23 Sep 2015. Furthermore there is no mention about Magento 2. Would it work for magento 2 or not? If not have you any other recomendations/suggestions? Commented May 16, 2017 at 2:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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