延期の解析 - Googleのページスピード

私のJavaScriptファイルのすべては、一番下にすでにあるが、Googleページスピードはスピードを向上させるために、この提案を与えている：のJavaScriptの延期の解析 - Googleのページスピード

88.6KiBの

延期解析JavaScriptは最初のページ読み込み中に解析されます。 JavaScriptを解析してページレンダリングのブロックを減らすことを延期します。 http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js （76.8KiB）http://websiteurl/js/plugins.js（11.7KiB）http://websiteurl/ （インラインのJavaScriptの109B）

これは私のhtml（例）

<html> 
<head> 
<!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> 
<head> 
<body> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
    <script>!window.jQuery && document.write(unescape('%3Cscript src="js/libs/jquery-1.5.1.min.js"%3E%3C/script%3E'))</script> 
    <script src="js/plugins.js"></script> 
    <script>$(document).ready(function() { 
      $("#various2").fancybox({ 
       'width': 485, 
       'height': 691, 
      }); 
     });</script> 
    </body> 
    </html>

である私がすることで、パフォーマンスを向上させるために何をすべき遅延を使用して？

Google Chrome専用ですか？

出典

2011-08-26 Jitendra Vyas

あなたが言うときなど、あなたがあなた自身の個人的に書かれたJSを参照している、またはあなたもjqueryのための ' –

最初にページのパフォーマンスを探している場合は、そのスクリプトをページの下部に移動して、他のアセットを読み込むことができます。

また、これはコードのほんの一部ですので、あなたは、単にであなたのplugins.jsファイルに追加することができ

<link rel="dns-prefetch" href="//ajax.googleapis.com">

Googleのコードのための基本ドメインを設定するために頭の中でDNSプリフェッチを使用します下にプラグインファイルを延期します。

<script src="js/plugins.js" defer></script>

私はとにかく、私のサイトはすべてyslowとページスピードでそれぞれ98と97に最適化されています。

希望します。

-V

出典

2012-02-27 07:30:41

私は、これは古い質問ですが、私は良い答えのために自分を探していたことから、私は私が現在使用方法を共有するつもりです参照してください。

インラインJavaScriptの場合、type属性をtext/deferred-javascriptなどのように変更すると、スクリプトタグ内のコードがページの読み込み中に評価されないようになります。それから私はページにonloadイベントに機能を付けます。上記の関数は、上記の型にマッチするすべてのスクリプトを見つけ、eval()を使って内部のコードを評価します。私は一般的に知っているeval()は悪ですが、ここで役立つようです。

外部のJavascriptファイルについては、私は非常に似ています。ページにスクリプトタグを追加するのではなく、ページのロードが完了した後にスクリプトタグを記録し、1つずつ挿入します。

インラインで遅延したJavascriptの1つにエラー（解析エラーなど）が含まれていると、後続のスクリプトがロードされない（ただし、現在の実装に依存する）という問題が1つあります。

出典

2013-01-20 14:32:02 idrarig

私はPagespeedで同じ問題を抱えています。私は、PagespeedアナライザーがJavascriptが本文の末尾にあるかどうかを確認していないと推測しています。

出典

2013-08-13 10:52:27 user2678245

最近、私たちは高速なWebアプリケーションを構築するのに役立つ "エレガントなフレームワーク"というオープンソースのnodejsフレームワークを作成しました。そして、すべてのページでデスクトップとモバイルの両方で100％Googleページの速度を達成することに成功しました。：あなたが理解できないものはそうコメントしてください、これまであなたはこれを試すことができます私は

のお手伝いをすることができますも場合は、ページのソースを表示し、そこから学ぶことができるものがたくさんある

https://developers.google.com/speed/pagespeed/insights/?url=getelegant.com

方法：

// Load script element as a child of the body 
function loadJS(src, callback) { 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    if (script.readyState) { //IE 
     script.onreadystatechange = function() { 
      if (script.readyState == "loaded" || script.readyState == "complete") { 
       script.onreadystatechange = null; 
       if (callback) { 
        callback(); 
       } 
      } 
     }; 
    } else { //Others 
     script.onload = function() { 
      if (callback) { 
       callback(); 
      } 
     }; 
    } 
    script.src = src; 
    document.body.appendChild(script); 
} 
// Load style element as a child of the body 
function loadCSS(href,callback) { 
    var element = document.createElement("link"); 
    element.rel = "stylesheet"; 
    if (element.readyState) { //IE 
     element.onreadystatechange = function() { 
      if (element.readyState == "loaded" || script.readyState == "complete") { 
       element.onreadystatechange = null; 
       if (callback) { 
        callback(); 
       } 
      } 
     }; 
    } else { //Others 
     element.onload = function() { 
      if (callback) { 
       callback(); 
      } 
     }; 
    } 
    element.href = href; 
    document.body.appendChild(element); 
} 
// Load All Resources 
function loadResources() { 
    // css 
    loadCSS("/compressed/code-mirror-style.css?please1"); 
    loadCSS("/compressed/all.css?please2"); 

    // js 
    loadJS("/compressed/code-mirror.js", function() { 
     loadJS("/compressed/common.js", function() { 
      $("[data-lang]").each(function() { 
       var code = $(this).addClass("code").text(); 
       $(this).empty(); 

       var myCodeMirror = CodeMirror(this, { 
        value: code, 
        mode: $(this).attr("data-lang"), 
        lineNumbers: !$(this).hasClass('inline') && !$(this).hasClass('no-numbers'), 
        readOnly: true 
       }); 
      }); 
     }); 
    }); 
} 

// Check for browser support of event handling capability 
if (window.addEventListener) { 
    window.addEventListener("load", loadResources, false); 
} else if (window.attachEvent) { 
    window.attachEvent("onload", loadResources); 
} else { 
    window.onload = loadResources 
}

出典

2014-01-09 21:09:37

<script type="text/javascript" defer="defer">タグに追加すると、それは私のために機能します。

<script type="text/javascript" defer="defer" src="<?php echo $this->getSkinUrl();?>js/jquery.bxslider.js"></script>

出典

2014-12-31 07:58:35

延期の解析 - Googleのページスピード

関連する問題