google-analytics(또는 기타 제3자) JS_javascript 팁을 로드하는 방법

ga를 등록하면 ga가 js 스크립트를 생성합니다. 많은 사람들이 이 j를

(Blog Park, CSDN, BlogJava 포함) 끝에 직접 복사합니다. 그런데 ga가 자동으로 생성한 JS가 정말 가장 합리적인 것일까요?

합리적인 것과 불합리한 것은 무엇입니까? ga는 분석 도구일 뿐이므로 프로그램에 영향을 주어서는 안 됩니다. 영향을 미치지 않는다면 합리적입니다.

ga의 현재 사용:
먼저 ga에 의해 자동으로 생성된 js 스크립트를 다음과 같이 살펴보세요.

코드 복사 코드는 다음과 같습니다.

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


이 코드를 보고 document.write를 사용하여 JS를 로드합니다. 이러한 방식으로 js를 로드하면 로드가 차단됩니다. 즉, 이 js는 그렇지 않습니다. 로드되었으며 이후의 모든 리소스와 JS 모두 다운로드 및 실행될 수 없습니다. 이 코드가 본문 끝에 있고, 끝에 내용이 없어서 막는 것이 없다고 생각하실 수도 있습니다.

JS를 작성할 때 페이지가 로드된 후 JS나 AJAX를 실행해야 하는 경우가 많습니다. 일반적으로 window.onload 이벤트에 작성되거나 jquery의 $(document)에 작성됩니다. ).ready( ) 메소드. 이러한 JS는 차단됩니다. 우리 페이지의 많은 데이터가 window.onload에서 AJAX를 사용하여 로드되었지만 현재 ga가 어떤 이유로(Harmony 및 Harmony) 이유로 액세스할 수 없거나 액세스가 매우 느린 경우입니다. 문제는 우리 JS가 ga의 JS가 로드되기를 기다리고 있었고 우리 JS는 ga의 js 로딩 시간이 초과된 후에만 실행된다는 것입니다.

예:
다음 코드는 jquery를 사용하여 document.ready에서 ajax 요청(요청 126.com)을 보냅니다. ga의 js가 로드되지 않도록 테스트하기 전에 호스트 파일을 수정하세요.

코드 복사 코드는 다음과 같습니다.

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

모니터링 사진:


위 사진에서 볼 수 있듯이 20초 시간 초과 후에는 ajax 요청이 실행됩니다. 0.173초 밖에 걸리지 않지만 20초를 기다립니다.

ga를 올바르게 사용하려면:

ga를 올바르게 사용하려면 두 가지 문제를 해결해야 합니다.
1. ga의 js를 로드하지 않는 방법 2. ga를 ga에서 사용하려면 ja가 로드된 직후 var pageTracker = _gat._getTracker("UA-123456-1"); pageTracker._trackPageview(); 코드를 실행하세요.
JS를 비차단 방식으로 로드하는 두 가지 주요 방법이 있습니다.
1. 2. new Image().src=""를 사용합니다. JS를 구문 분석하지 않고 다운로드됩니다. 따라서 이를 사용하여 js를 로드한 후에는 내부 함수를 호출할 수 없습니다(이 방법은 일반적으로 사전 로드에 사용됩니다).

개선된 코드:




코드 복사

코드는 다음과 같습니다.

위 코드는 jquery의 ajax 코드를 수정한 것입니다. 위 코드는 js를 로드하기 위한 스크립트를 동적으로 생성하고, onload 또는 onreadystatechange 이벤트를 통해 로드한 후 코드를 실행하는 코드입니다.

코드 수정이 완료되면 다음과 같이 모니터링하고 테스트합니다.

ga는 여전히 20초 동안 로드되어 있었지만 우리의 ajax 요청은 20초가 실행될 때까지 기다리지 않고 즉시 실행되었음을 그림에서 볼 수 있습니다.

j

쿼리 로드 ga:

위의 코드가 작성하기가 너무 많고 번거롭다고 생각하실 수도 있습니다. jquery를 사용하면 다음과 같이 단순화할 수 있습니다.

코드 복사 코드는 다음과 같습니다:

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();
} catch(err) {}
});

필요한 경우 확인하세요: 고성능 WEB 개발 시리즈

[설명] 전재할 경우 출처를 명시해주세요: http://www.cnblogs.com/BearsTaR/. 상업적 이용을 금지합니다