[javascript] 함수가 실행하는 데 걸리는 시간을 측정하는 방법
실행 시간을 밀리 초 단위로 가져와야합니다.
원래 2008 년에이 질문을했습니다. 받아 들여진 대답은 new Date (). getTime () 을 사용하는 것이 었습니다 . 그러나 이제 표준 performance.now () API 를 사용하는 것이 더 적합 하다는 것에 동의 할 수 있습니다 . 따라서 수락 된 답변을 이것으로 변경하고 있습니다.
답변
사용 ) (performance.now를 :
var t0 = performance.now()
doSomething() // <---- The function you're measuring time for
var t1 = performance.now()
console.log("Call to doSomething took " + (t1 - t0) + " milliseconds.")
NodeJs
: 클래스 를 가져와야합니다.performance
console.time 사용 :(비표준)( 생활 기준 )
console.time('someFunction')
someFunction() // Whatever is timed goes between the two "console.time"
console.timeEnd('someFunction')
참고 : 및메소드
에 전달되는 문자열이일치해야합니다( 타이머가 예상대로 완료되도록).time()
timeEnd()
console.time()
설명서 :
답변
getTime () 메소드는 1970 년 1 월 1 일 자정 이후의 밀리 초 수를 리턴합니다.
전의.
var start = new Date().getTime();
for (i = 0; i < 50000; ++i) {
// do something
}
var end = new Date().getTime();
var time = end - start;
alert('Execution time: ' + time);
답변
Date ()를 사용하지 마십시오. 아래를 읽으십시오.
<script>
var a = performance.now();
alert('do something...');
var b = performance.now();
alert('It took ' + (b - a) + ' ms.');
</script>
그것은 작동합니다 :
-
IE 10 ++
-
파이어 폭스 15 ++
-
크롬 24 ++
-
사파리 8 ++
-
오페라 15 ++
-
안드로이드 4.4 ++
console.time
가능한있을 수 있습니다 당신을 위해 ,하지만 비표준입니다 § :
이 기능은 비표준이며 표준 트랙이 아닙니다. 웹이있는 프로덕션 사이트에서는 사용하지 마십시오. 모든 사용자에게 적용되는 것은 아닙니다. 구현 간에는 큰 비 호환성 이있을 수 있으며 향후 동작이 변경 될 수 있습니다.
브라우저 지원 외에도 의 기본 버전 인 것처럼보다 정확한 타이밍을 제공 할 가능성performance.now
이있는 것 같습니다 .console.time
<rant> 또한 “시스템 시간”의 변경에 영향을 받기 때문에 어떤 용도 Date
로 도 사용하지 마십시오 . 즉 , 사용자에게 정확한 시스템 시간이 없으면 “음성 타이밍”과 같은 잘못된 결과 가 나타 납니다 .
2014 년 10 월에 시스템 시계가 엉망이되어서 무엇을 추측 할 수 있을까요 ? … Gmail을 열어서 ” 0 분 전 보낸” 모든 이메일을 보았습니다 . 그리고 구글의 세계적 엔지니어들이 Gmail을 만들어야한다고 생각했습니다 …….
(시스템 시계를 1 년 전으로 설정하고 Gmail로 이동하여 모두 즐거운 시간을 보내십시오. 언젠가는 JS 의 명예의 전당 을 갖게 될 것 Date
입니다.)
Google 스프레드 시트의 now()
기능도이 문제로 인해 어려움을 겪고 있습니다.
당신이 사용할 유일한 시간 Date
은 사용자 에게 자신의 시스템 시계 시간 을 보여주고 싶을 때입니다. 아니 당신이 얻을하려는 경우 시간 또는 측정 아무것도에 있습니다.
답변
로컬 개발 시스템에서 함수 실행 시간을 가져와야하는 경우 브라우저의 프로파일 링 도구 또는 console.time()
및과 같은 콘솔 명령을 사용할 수 있습니다 console.timeEnd()
.
모든 최신 브라우저에는 JavaScript 프로파일 러가 내장되어 있습니다. 이러한 프로파일 러는 기존 코드를 수정할 필요가 없으므로 가장 정확한 측정 값을 제공해야합니다. 이는 기능의 실행 시간에 영향을 줄 수 있습니다.
JavaScript를 프로파일 링하려면 :
- 에서 크롬 키를 눌러 F12 선택 프로파일 탭, 다음 수집 자바 스크립트 CPU 프로필 .
- 에서 파이어 폭스 , 오픈 / 방화범을 설치하고 클릭 프로필 버튼을 클릭합니다.
- 에서 IE 9+ 키를 눌러 F12 , 클릭 스크립트 또는 프로파일 (IE 버전에 따라).
또한, 개발 시스템에 , 당신은 당신과 코드에 장비를 추가 할 수 있습니다 console.time()
와 console.timeEnd()
. Firefox11 +, Chrome2 + 및 IE11 +에서 지원되는이 기능은을 통해 시작 / 중지하는 타이머를보고합니다 console.time()
. time()
사용자 정의 타이머 이름을 인수로 사용하고 timeEnd()
타이머가 시작된 이후 실행 시간을보고합니다.
function a() {
console.time("mytimer");
... do stuff ...
var dur = console.timeEnd("myTimer"); // NOTE: dur only works in FF
}
Firefox에서만 timeEnd()
통화 경과 시간을 반환합니다 . 다른 브라우저는 단순히 결과를 개발자 콘솔에보고합니다. 반환 값 timeEnd()
은 정의되어 있지 않습니다.
wild에서 함수 실행 시간을 얻으 려면 코드를 계측해야합니다. 몇 가지 옵션이 있습니다. 다음을 쿼리하여 시작 및 종료 시간을 간단히 저장할 수 있습니다 new Date().getTime()
.
function a() {
var start = new Date().getTime();
... do stuff ...
var end = new Date().getTime();
var dur = end - start;
}
그러나 Date
개체의 해상도는 밀리 초이며 OS의 시스템 시계 변경에 영향을받습니다. 최신 브라우저에는 더 나은 옵션이 있습니다.
더 나은 옵션은 일명 고해상도 시간 을 사용하는 것 window.performance.now()
입니다. 두 가지 중요한 방식으로 now()
기존보다 낫습니다 Date.getTime()
.
-
now()
페이지 탐색이 시작된 이후 밀리 초 수를 나타내는 밀리 초 미만의 해상도를 가진 double입니다. 분수 단위의 마이크로 초 수를 반환합니다 (예 : 1000.123은 1 초, 123 마이크로 초). -
now()
단조롭게 증가하고 있습니다. 이것은 중요하다Date.getTime()
할 가능성이 후속 호출에 뒤로 앞으로 또는 이동. 특히 OS의 시스템 시간이 업데이트되면 (예 : 원자 시계 동기화)Date.getTime()
업데이트됩니다.now()
항상 단조 증가하는 것을 보장하므로 OS의 시스템 시간에 영향을받지 않습니다-항상 벽시계 시간입니다 (벽시계가 원자가 아니라고 가정).
now()
거의 모든 곳에서 사용할 수 있습니다 new Date().getTime()
, + new Date
andt Date.now()
있습니다. 단 , 유닉스 시대 (1970 년 이후의 밀리 초 수)를 기반으로하는 것처럼 시간 Date
과 now()
시간이 혼합되지 않는 반면 페이지 탐색이 시작된 이후의 시간 (밀리 초)은 훨씬 좁습니다 .Date
now()
Date
사용 방법의 예는 다음과 같습니다 now()
.
function a() {
var start = window.performance.now();
... do stuff ...
var end = window.performance.now();
var dur = end - start;
}
now()
Chrome 안정, Firefox 15 이상 및 IE10에서 지원됩니다. 사용 가능한 여러 폴리 필도 있습니다.
야생에서 실행 시간을 측정하기위한 다른 옵션은 UserTiming 입니다. UserTiming은 console.time()
and와 비슷하게 작동 console.timeEnd()
하지만 사용하는 것과 동일한 고해상도 타임 스탬프를 now()
사용하므로 (1 밀리 초 미만의 단조 증가하는 클럭을 얻음) 타임 스탬프와 지속 시간을 PerformanceTimeline에 저장합니다 .
UserTiming에는 마크 (타임 스탬프)와 측정 ( 두께)의 개념이 있습니다. 원하는만큼 정의 할 수 있으며 PerformanceTimeline에 노출됩니다 .
타임 스탬프를 저장하려면을 호출하십시오 mark(startMarkName)
. 첫 마크 이후의 기간을 얻으려면을 호출하면 measure(measurename, startMarkname)
됩니다. 그런 다음 기간이 마크와 함께 PerformanceTimeline에 저장됩니다.
function a() {
window.performance.mark("start");
... do stuff ...
window.performance.measure("myfunctionduration", "start");
}
// duration is window.performance.getEntriesByName("myfunctionduration", "measure")[0];
UserTiming은 IE10 + 및 Chrome25 +에서 사용할 수 있습니다. 내가 쓸 수 있는 polyfill도 있습니다.
답변
정확한 값을 얻으려면 성능 인터페이스 를 사용해야합니다 . Firefox, Chrome, Opera 및 IE의 최신 버전에서 지원됩니다. 사용 방법의 예는 다음과 같습니다.
var performance = window.performance;
var t0 = performance.now();
doWork();
var t1 = performance.now();
console.log("Call to doWork took " + (t1 - t0) + " milliseconds.")
Date.getTime()
또는 console.time()
정확한 실행 시간을 측정하는 데 좋지 않습니다. 대략적인 대략적인 추정치가 괜찮다면이를 사용할 수 있습니다. 대략적인 추정에 따르면 실시간에서 15-60ms 이동 할 수 있습니다.
JavaScript에서 실행 시간 측정에 대한 이 훌륭한 게시물 을 확인하십시오 . 저자는 또한 읽을 가치가있는 JavaScript 시간의 정확성에 관한 몇 가지 링크를 제공합니다.
답변
Firebug를 사용하고 Console과 Javascript를 모두 활성화하십시오. 프로필을 클릭하십시오. 새로 고침 프로필을 다시 클릭하십시오. 보고서를보십시오.
답변
var StopWatch = function (performance) {
this.startTime = 0;
this.stopTime = 0;
this.running = false;
this.performance = performance === false ? false : !!window.performance;
};
StopWatch.prototype.currentTime = function () {
return this.performance ? window.performance.now() : new Date().getTime();
};
StopWatch.prototype.start = function () {
this.startTime = this.currentTime();
this.running = true;
};
StopWatch.prototype.stop = function () {
this.stopTime = this.currentTime();
this.running = false;
};
StopWatch.prototype.getElapsedMilliseconds = function () {
if (this.running) {
this.stopTime = this.currentTime();
}
return this.stopTime - this.startTime;
};
StopWatch.prototype.getElapsedSeconds = function () {
return this.getElapsedMilliseconds() / 1000;
};
StopWatch.prototype.printElapsed = function (name) {
var currentName = name || 'Elapsed:';
console.log(currentName, '[' + this.getElapsedMilliseconds() + 'ms]', '[' + this.getElapsedSeconds() + 's]');
};
기준
var stopwatch = new StopWatch();
stopwatch.start();
for (var index = 0; index < 100; index++) {
stopwatch.printElapsed('Instance[' + index + ']');
}
stopwatch.stop();
stopwatch.printElapsed();
산출
Instance[0] [0ms] [0s]
Instance[1] [2.999999967869371ms] [0.002999999967869371s]
Instance[2] [2.999999967869371ms] [0.002999999967869371s]
/* ... */
Instance[99] [10.999999998603016ms] [0.010999999998603016s]
Elapsed: [10.999999998603016ms] [0.010999999998603016s]
performance.now () 는 선택 사항입니다. StopWatch 생성자 함수에 false를 전달하면됩니다.