[] 신규 Arry(1000)보다 빠르다는 게 사실입니까?

11741 단어 JavaScript

계기.


지난번 기사를 쓰기 위해 다양한 XSS 공격 방법을 실험했지만, 같은 공격에도 다양한 스크립트 삽입 방법이 있다는 것을 알고 실행 속도에 차이가 있는지 조사하고 있다.
그거는 나중에 쓰려고 했는데 자바스크립트에 대한 퍼포먼스가 꾸며져 있고 1000가지 요소를 추가할 때 []선언을 하는 경우와 new Aray(1000)선언을 하는 경우는 []가 V8보다 2배 빠르다는 기사가 나와서 놀랐어요.д゜)
어떤 실장을 해야만 그런 일이 발생할 수 있습니까?
C++의 std:vector라면 내부 버퍼 메모리의 크기가 부족하면 2배의 연속 메모리를 확보하고 전체적으로 복사합니다.
.NET Framework의 List 레벨도 같은 설치여야 합니다.
리스트반에서 발췌하다
private void EnsureCapacity(int min) {
    if (_items.Length < min) {
        int newCapacity = _items.Length == 0? _defaultCapacity : _items.Length * 2;
        if ((uint)newCapacity > Array.MaxArrayLength) newCapacity = Array.MaxArrayLength;
        if (newCapacity < min) newCapacity = min;
        Capacity = newCapacity;
    }
}
역시 두 배로 늘었네.
이렇게 되면 사이즈가 늘어나면서 연속적인 메모리 확보와 복사 비용도 올라가기 때문에 처음부터 사이즈를 상대방에게 줄 수 있다면 좋을 것 같다.
NET의 메모리 관리를 제대로 배우지 못했지만 관리라면 메모리가 연속되지 않아도 되는 건가요?
JavaScript라면 메모리가 연속되지 않아도 되기 때문에 하나의 버퍼 메모리가 매우 커지지 않고 어느 정도 커지지 않도록 다른 버퍼 메모리가 연속처럼 보일 수 있도록 하세요.
어떤 실상인지 상상할 수 없다(´.ω・`)

실험해 보았다


그래서 진짜인지 아닌지 시험해 봤어요.
테스트 코드
function test() {
    var run  = 100;
    var cnt  = 10000;
    var size = 10000000 / cnt;
    var msA  = 0;
    var msB  = 0;

    for (var i = 0; i < run; i++) {
        msA += testA(cnt, size);
        msB += testB(cnt, size);
    }
    console.log('A ' + (msA / run) + " ms");
    console.log('B ' + (msB / run) + " ms");

    function testA() {
        var startTime = new Date();
        for (var i = 0; i < cnt; i++) {
            var arr = [];
            for (var j = 0; j < size; j++) {
                arr[j] = 0;
            }
        }
        var endTime = new Date();
        return endTime - startTime;
    }

    function testB() {
        var startTime = new Date();
        for (var i = 0; i < cnt; i++) {
            var arr = new Array(size)
            for (var j = 0; j < size; j++) {
                arr[j] = 0;
            }
        }
        var endTime = new Date();
        return endTime - startTime;
    }
}
진열은 1000만 번의 0을 대입하여 그것에 걸린 시간을 측정한다.
나는 그 100번을 실행한 평균치를 조사했다.cnt 변수의 숫자가 커지면 여러 번 소수조를 대입할 수 있고cnt 변수의 숫자가 작아지면 작은 수조를 만들어 대입할 수 있기 때문에 다음과 같은 관계가 있다.
게다가 실행 횟수가 너무 오래 걸려서 이런 조사 방법을 채택하였다д`)
배열 크기
10
100
1,000
10,000
100,000
1,000,000
실행 횟수
1,000,000
100,000
10,000
1,000
100
10

측정 결과




기본적으로 new Aray(x)가 더 빠릅니다.
V8의 처리 방법이 바뀌었습니까?
크롬과 오페라의 성향은 오차급이지만 오페라의 속도는 조금 빠르다.
그러나 배열 사이즈가 10만에 달했을 때 크롬과 오페라의 퍼포먼스는 극단적으로 떨어졌고 new Aray(x)와 IE의 수준은 같았다.
자주 사용하는 사이즈라 빠르게 조정이 돼요.

10개의 상황을 배열하다


InternetExplorer 11
GoogleChrome 37
MozillaFirefox 32
Opera 24
[ ]
656.67
42.80
78.98
41.29
new Array(x)
737.88
22.69
126.77
21.36

배열 100 개 시


InternetExplorer 11
GoogleChrome 37
MozillaFirefox 32
Opera 24
[ ]
633.71
48.32
89.79
45.60
new Array(x)
576.24
14.10
35.15
12.97

배열이 1000개인 경우


InternetExplorer 11
GoogleChrome 37
MozillaFirefox 32
Opera 24
[ ]
612.07
41.73
117.06
38.99
new Array(x)
559.40
10.64
54.06
9.82

배열 10000개


InternetExplorer 11
GoogleChrome 37
MozillaFirefox 32
Opera 24
[ ]
619.40
43.41
76.83
41.22
new Array(x)
558.55
10.39
80.28
9.88

배열 100000개 시


InternetExplorer 11
GoogleChrome 37
MozillaFirefox 32
Opera 24
[ ]
625.12
42.16
70.14
39.25
new Array(x)
559.32
411.66
55.29
375.22

배열이 1000개인 경우


InternetExplorer 11
GoogleChrome 37
MozillaFirefox 32
Opera 24
[ ]
646.35
153.36
67.02
132.58
new Array(x)
598.95
807.45
66.91
782.40

결론:좋아하는 사람은 말하세요


모든 브라우저의 배열 사이즈가 100~1000개일 때 가장 빠르고 10개로 작으면 성능이 미묘하게 떨어진다.
[] 더 빠른 경우는 10개일 때는 IE와 Firefox, 10만개 이상일 때는 크롬과 오페라 정도다.
만약 여러 번 배열을 만드는 특수한 상황이 있다면 10000개 이하의 new Aray(x)는 괜찮은 것 같고, 그 이상의 개수[]라면 좋겠다.
하지만 그냥 몇 개의 배열을 해서 사용하는 정도라면 단도직입적으로 말해서 아무것도 바뀌지 않고 좋아하는 쪽을 쓰면 되잖아요.
가독성, 유형수, 검색성, 코드 규약, 배치 상황과 개인의 취향에 따라 선택하시면 됩니다(\`)

좋은 웹페이지 즐겨찾기