Javascript : 여러 함수 실행시 신비한 지연

Question

다음 함수는 단순히 문서에서 지정된 태그 이름을 가진 요소를 반환합니다. 함수를 연속적으로 호출 할 때 어떤 이유로 함수의 실행 속도가 느려지고 느려집니다.이를 철저히 테스트 했으므로 for-loop 라인을 테스트했지만 왜 연속 호출이 느려지는지 이해하지 못합니다 .

function getElementsByTagName2(tagName){ 
    var arr=new Array(); 
    var elems=document.getElementsByTagName(tagName); 
    for(var i=0, len=elems.length; i!=len; arr.push(elems[i++])); 
    return arr 
} 

편집 : 사용자 이름을 257493으로 변경했습니다.

EDIT1 : 그냥 jQuery를 테스트 한 것과 같은 문제가 있습니다. 그러나 성능 저하는 미미합니다.

Answer 1

코드를 테스트 한 결과 정상적으로 실행 된 것으로 보입니다.

내 결과 (반복 -> 타임 촬영 (발견 된 div)

1. 파이어 폭스 :
0 -> 1534 (102)
2 발견 -> 1524()가 102을 발견 -> 1,518 (발견 102)
3 -> 1,513
,691 (102 있음) -
가 ...> 1535 (102 있음) -> 1528 (102 있음) 4는
363,210 16 -> 1,513 (102 없음) - -> 1,513 이 (102 있음) -> 1512
17 (102 없음)> 1518 (102 있음)

2. 크롬 :
0 -> 271 (102 있음) -> 272
4 (102 있음) -> 268
3 (102 없음) -> 283
2 (102 있음) -> 387
1 (102 없음)
... 0 12, 15 -> 272 (102 있음) -> 287
19 (102 있음) -> 267
18 (102 있음) -> 279
17 (102 있음) -> 270
16 (102 없음)

Answer 2

기능 실행 간에는 어떤 차이가 있습니까? DOM은 어떻게 바뀌나요? 리턴 엘리먼트의 수가 증가했기 때문에 각각이 더 오래 걸릴 확률은 얼마입니까? 또한 푸시가 느립니다. 이것은 또한 작동하고 약간 속도를 올릴 수도 있습니다 - 나는 반복 실행에 지연을 보이지 않습니다.

function getElementsByTagName2(tagName) { 
    var arr = new Array(), 
    elems = document.getElementsByTagName(tagName); 
    for (var i = 0, len = elems.length; i != len; arr[i] = elems[i], ++i); 
    return arr; 
} 

Answer 3

푸시하지 않고 배열 요소를 직접 할당하십시오.

function getElementsByTagName2(tag, pa){ 
    pa= pa || document; 
    tag= pa.getElementsByTagName(tag); 
    var L= tag.length, A= []; 
    while(L){ 
     A[--L]= tag[L]; 
    } 
    return A 
} 
getElementsByTagName2('*',document.body) 

Answer 4

프로토 타입 대 배열 방법에도 동일한 문제가 있습니까?

function $A(iterable) { 
    if (!iterable) return []; 
    if ('toArray' in Object(iterable)) return iterable.toArray(); 
    var length = iterable.length || 0, results = new Array(length); 
    while (length--) results[length] = iterable[length]; 
    return results; 
}