ページスピード - 上記の倍の量でレンダリングブロックJavaScriptとCSSを排除

私が実行しているmagento 1.9、と私は使用していますRWD sliderホームページにMagentoの1.9が付属しているが。

Google PageSpeedはこれを好まず、次のように述べています。

レンダリングブロックJavaScriptとCSS以上の倍の量で解消

スライダーを呼び出すこのjavaスクリプトファイルに対して、どうすればよいですか。

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

私は次のようにMagentoの-1.9.x上でレンダリングブロックJavaScriptの問題を解決する削除します：

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

あなたは\レイアウト\ page.xmlデフォルト\アプリ\設計\フロントエンド\拠点としてRWDのアクティブなテーマ別のパスEXを使用している場合

「Mohan Gs」で説明されている手法はここでは機能しません。

jsパスのために、/media/js/彼はjsマージを使用しているようです。ことを意味し、すべてのjsファイルはXMLの標準的な方法によって追加されたこと

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

は大きなものに統合され/media/js/<hash>.jsます。

Magentoコアjsファイルが追加されました

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

あまりにもこのようにして、。

インラインjsを使用するテンプレートも多数ありますが、head jsファイルで定義されるオブジェクト/関数に依存します。

この時点で、それは十分ではありません下にだけ頭のjsファイルを移動することです。すべてのインラインjs宣言は、ヘッドjsの後、前に</body>も移動する必要があります。

すべて/多くの場合、テンプレート固有の変数を使用しているため、インラインjsをテンプレートから分離することはできません。

あなただけの最終的な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.jsHTMLファイルと同じフォルダにある必要があります。

詳細については、この記事を参照してください。

https://github.com/mediarox/pagespeedを解決するためのオープンソース拡張機能を次に示します。

現在の機能

• 一番下に、すべてのJavaScriptタグ（ヘッド＆インライン）を移動します。（{stripped_html} {js}）
• 条件JSユニット（{複数JSタグ}）を含みます
• 「インライン」jsタグを含む外部jsタグを含む
• 一番下に、すべてのCSSタグ（ヘッド＆インライン）を移動します。（{stripped_html} {CSS}）
• 条件付きCSSユニット（{複数のCSSタグ}）を含みます
• 外部CSSタグを含みます
• インラインcssタグを含む

適合性

Magentoの1.5.xのからMagentoの1.9.xへ。

バックエンド構成

すべてのモジュール（Pagespeed_Js、Pagespeed_Css）は、デフォルトでは無効になっています。

設定パス：[システム]> [設定]> [高度]> [ページ速度]

使い方 ？

イベント「controller_front_send_response_before」の最終的なHTMLストリーム解析シンプル。