PageSpeed ​​- Устранить блокирование рендеринга JavaScript и CSS в верхнем содержании

Я бегу magento 1.9, и я использую то, RWD sliderчто поставляется с Magento 1.9 на домашней странице.

Google PageSpeedне любит это и говорит:

Устранить блокировку рендеринга JavaScript и CSS в верхнем содержании

Как я могу сделать это для этого файла сценария Java, который вызывает слайдер:

http://www.MYDOMAIN/media/js/sdhfksjfhdsjvbskj8e4w.js

Я решаю проблему с блокировкой рендеринга JavaScript в Magento-1.9.x следующим образом:

<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>

Подсказки: он может найти на базовую тему

app \ design \ frontend \ base \ default \ layout \ page.xml о строке: 38,

Если вы используете активную тему другого пути ex для rwd как app \ design \ frontend \ base \ default \ layout \ page.xml

Техника, описанная "Mohan Gs", здесь не сработает.

Из-за пути js /media/js/кажется, что он использует js merging . Это означает, что все файлы js добавляются стандартным способом xml

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

будут объединены в один большой /media/js/<hash>.js.

Добавлены js-файлы Magento core

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

Сюда тоже.

Есть также много шаблонов, использующих встроенный js, который зависит от объектов / функций, которые определены файлами head js.

На данный момент, это не достаточно, чтобы переместить только файлы JS головы вниз. Вы должны переместить все встроенные объявления js после заголовка js и перед ним </body>тоже.

Во всех / многих случаях невозможно отделить встроенные j от шаблонов, потому что они используют переменные, специфичные для шаблона.

Вы можете использовать только общий метод, такой как синтаксический анализ окончательного HTML и перемещать все это вместе и в правильном порядке.

Итак, взгляните на расширение Pagespeed .

Этот код говорит, что дождитесь загрузки всего документа, а затем загрузите внешний файл defer.js.

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

Это шаги, которые вам нужно выполнить.

1. Скопируйте код выше.

2. Вставьте код в HTML прямо перед </body>тегом (в нижней части HTML-файла).

3. Измените defer.jsимя вашего внешнего файла JS.

4. Убедитесь, что путь к вашему файлу правильный. Пример: если вы просто положите defer.js, файл defer.jsдолжен находиться в той же папке, что и ваш HTML-файл.

Для более подробной информации, обратитесь к этой статье

Вот расширение с открытым исходным кодом, чтобы решить, что https://github.com/mediarox/pagespeed

Текущие функции

• Переместите все теги Javascript (head & inline) вниз. ({Stripped_html} {} JS)
• включая условные единицы измерения js ({несколько тегов js})
• включая внешние теги js, включая встроенные теги js
• Переместите все теги CSS (head & inline) вниз. ({Stripped_html} {} CSS)
• включая условные единицы измерения css ({несколько тегов css})
• включая внешние теги CSS
• включая встроенные теги CSS

Совместимость

С Magento 1.5.x до Magento 1.9.x.

Конфигурация сервера

Все модули (Pagespeed_Js, Pagespeed_Css) по умолчанию отключены.

Путь конфигурации: Система> Конфигурация> ДОПОЛНИТЕЛЬНО> Скорость страницы

Как это устроено ?

Просто проанализируйте окончательный HTML-поток по событию "controller_front_send_response_before".