Google Analytics (またはその他のサードパーティ) JS_JavaScript を読み込む方法のヒント

ga を登録すると、ga は js スクリプトを生成します。この js を

の最後に直接コピーします (Blog Park、CSDN、BlogJava を含む)。しかし、ga が自動生成したこの JS が本当に合理的なのでしょうか?

何が合理的で何が不合理なのか? ga は単なる分析ツールなので、それを使用してもプログラムに影響を与えてはなりません。影響がなければ妥当です。

ga の現在の使用法:
まず、次のように ga によって自動的に生成された js スクリプトを確認します:

コードをコピー コードは次のとおりです。

try {
var pageTracker = _gat._getTracker("UA-123456-1");
pageTracker._trackPageview(); err) {}< ;/script>


このコードを見て、document.write を使用して JS をロードすると、ロードがブロックされることに注意してください。がロードされ、後続のすべてのリソースと JS のどちらもダウンロードして実行できません。このコードは本文の最後にあり、最後にはコンテンツがないため、ブロックするものは何もないと思われるかもしれません。
JS を記述するときに、ページが読み込まれた後に JS または AJAX を実行する必要があることがいくつかあると思います。これらは、通常、window.onload イベントに記述されるか、jquery の $(document に記述されます)。 ).ready() メソッド。これらの JS はブロックされます。ページ上の大量のデータが window.onload で AJAX を使用して読み込まれているが、現時点では何らかの理由 (Harmony と Harmony) でそのデータにアクセスできないか、アクセスが非常に遅い場合。問題は、私たち自身の JS が ga の JS がロードされるのを待っており、私たちの JS は ga の JS ロードがタイムアウトした後にのみ実行されることです。

例:
次のコードは、jquery を使用して、document.ready で ajax リクエスト (リクエスト 126.com) を送信します。 ga の js がロードできないようにテスト前にホスト ファイルを変更します:





コードをコピー

コードは次のとおりです:

try {
var pageTracker( "UA-123456 -1"); pageTracker._trackPageview()
} catch(err)
🎜>

モニタリング画像:


上の図からわかるように、20 秒のタイムアウトの後、ajax リクエストが実行されます。 0.173秒しかかかりませんが、20秒かかります。

ga を適切に使用する:

ga を適切に使用するには、次の 2 つの問題を解決する必要があります: 1. ga の js をロードしない方法、
2. ga を ga に使用するには、ja がロードされた直後に、var pageTracker = _gat._getTracker("UA-123456-1"); コードを実行します。
JS をノンブロックでロードするには、主に 2 つの方法があります: 1. <script>2. new Image().src="" を使用します。この方法では JS のみが実行されます。 JS を解析せずにダウンロードされます。したがって、これでjsをロードした後、内部の関数を呼び出すことはできません（このメソッドは通常、プリロードに使用されます）。 <br><BR>改善されたコード: <BR><br><br><BR><BR>コードをコピー<br><br><BR> コードは次のとおりです:<div class="codetitle"><div class="codebody" id="code35294"> <BR><script type="text/javascript"> <BR>var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http ://www."); <BR>var head = document.getElementsByTagName("head")[0] || document.documentElement; <BR>var script = document.createElement("script"); <BR>script .src = gaJsHost "google-analytics.com/ga.js"; <br><br>var doned = false; // onload と onreadystatechange が同時に実行されないようにします<BR>// 読み込み完了後に実行します。 、すべてのブラウザに適応します<BR>script.onload = script.onreadystatechange = function() { <BR>if (!done && (!this.readyState || this.readyState === "loaded" || this.readyState = == "完了") ){ <BR>done = true; <BR>var pageTracker = _gat._getTracker("UA-123456-16"); >} catch(err) {} <BR>script.onload = script.onreadystatechange = null; <BR>head.insertBefore(script,head.firstChild); script><BR><BR><BR>上記のコードは jquery の ajax コードを変更したものです。上記のコードは理解しやすいもので、js をロードするスクリプトを動的に作成し、ロード後に onload または onreadystatechange イベントによってコードを実行します。 <BR> <BR> <BR> コードの変更が完了したら、次のように監視してテストします。<BR> <BR> <DIV><DIV> <DIV> <DIV id=s49. style="TEXT-ALIGN: left"> この図から、ga はまだ 20 秒間ロードされていることがわかりますが、ajax リクエストは実行まで 20 秒待たずにすぐに実行されました。 <img src="/static/imghwm/default1.png" data-src="http://files.jb51.net/upload/201005/20100513165841127.jpg?x-oss-process=image/resize,p_40" class="lazy" alt="Google Analytics (またはその他のサードパーティ) JS_JavaScript を読み込む方法のヒント" > jクエリ読み込み ga:<DIV> <DIV> おそらく、上記のコードは書くのが多すぎて面倒だと思われるかもしれません。jquery を使用する場合は、次のように簡略化できます: <DIV><STRONG>コードをコピー<DIV> <BR><div class="codetitle"> コードは次のとおりです: <span><a style="CURSOR: pointer" data="74815" class="copybut" id="copybut74815" onclick="doCopy('code74815')"><U>var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http: // www."); $.getScript(gaJsHost "google-analytics.com/ga.js",function(){ try { var pageTracker = _gat._getTracker("UA-123456 -16 "); pageTracker._trackPageview(); <div class="codebody" id="code74815">} catch(err) {} <BR>});<BR><BR><BR>必要に応じて、次を確認してください: ハイパフォーマンス WEB開発シリーズ<BR> <BR>【声明】転載の際は出典を明記してください: http://www.cnblogs.com/BearsTaR/。 商用利用禁止 <BR></script>