[ Web 관련 ]/자바스크립트

자바스크립트 페이지 속도 체크 코드

BIZLAB 2019. 3. 8. 01:48
<script type="text/javascript">



	function chk(){

		var ntime = performance.timing;

		 

		var total = ntime.loadEventEnd - ntime.navigationStart; //전체 소요시간

		var redirect = ntime.redirectEnd - ntime.redirectStart; // 동일 origin에서의 redirect 시간

		var cache = ntime.domainLookupStart - ntime.fetchStart; // cache 시간

		var dnslookup = ntime.domainLookupEnd - ntime.domainLookupStart; //DNS Lookup 시간

		var connect = ntime.connectEnd - ntime.connectStart; // 웹서버 연결 시간

		var request = ntime.responseStart - ntime.requestStart; // 요청 소요 시간

		var response = ntime.responseEnd - ntime.responseStart; // 응답 데이터를 모두 받은 시간

		var dom = ntime.domComplete - ntime.domLoading; // DOM객체 생성 시간 *******************

		var load = ntime.loadEventEnd - ntime.loadEventStart; // 브라우저의 Load 이벤트 실행시간

		var pageEnd = ntime.loadEventEnd - ntime.responseEnd; //  서버에서 페이지를 받고 페이지를 로드하는데 걸린 시간

		var networkDelay = ntime.responseEnd - ntime.fetchStart; //  네트워크 지연 시간

		 

		console.log("total : " + total + "ms  >>>>>>>  전체 소요시간");

		console.log("redirect : " + redirect + "ms  >>>>>>>   동일 origin에서의 redirect 시간");

		console.log("cache : " + cache + "ms   >>>>>>>  cache 시간");

		console.log("dnslookup : " + dnslookup + "ms  >>>>>>>  DNS Lookup 시간");

		console.log("connect : " + connect + "ms  >>>>>>>  웹서버 연결 시간");

		console.log("request : " + request + "ms  >>>>>>>  요청 소요 시간");

		console.log("response : " + response + "ms  >>>>>>>  첫 응답으로 부터 응답 데이터를 모두 받은 시간");

		console.log("dom : " + dom + "ms  >>>>>>>  DOM객체 로드 완료 시간");

		console.log("load : " + load + "ms  >>>>>>>  브라우저의 Load 이벤트 실행시간");

		console.log("pageEnd : " + pageEnd + "ms  >>>>>>>  서버에서 페이지를 받고 페이지를 로드하는데 걸린 시간");

   }

   </script>