К основному контенту

Сравнение скорости создания JavaScript объекта NoPrototype vs Prototype

Меня всегда мучил вопрос, какая разница в производительности при использовании JavaScript класса созданного, с и без использования прототипов. Вот интерес победил и я написал небольшой тест. Но для начала посмотрим на соперников.


Соперники
  • Класс в NoPrototype стиле:
var NoPrototypeClass = function () {
    var self = this;
    self.i = 0;

    self.Metod1 = function () {
        self.i++;
    };
    self.Metod2 = function () {
        self.i++;
    };
    self.Metod3 = function () {
        self.i++;
    };
    self.Metod4 = function () {
        self.i++;
    };
    self.Metod5 = function () {
        self.i++;
    };
};

  • Класс в Prototype стиле:
function PrototypeClass() {
    this.i = 0;
}

PrototypeClass.prototype.Metod1 = function () {
    this.i++;
};

PrototypeClass.prototype.Metod2 = function () {
    this.i++;
};

PrototypeClass.prototype.Metod3 = function () {
    this.i++;
};

PrototypeClass.prototype.Metod4 = function () {
    this.i++;
};

PrototypeClass.prototype.Metod5 = function () {
    this.i++;
};


Соперники готовы, теперь можно и сравнить скорость (выполнить):
function getTime() {
    var day = new Date();
    return day.getTime();
}

var noPrototypeTimes = [];
var prototypeTimes = [];

for (var step = 2; step <= 5; step++) {
    var iterationCount = Math.pow(10, step);

    var start = getTime();

    for (var i = 0; i < iterationCount; i++) {
        var c1 = new NoPrototypeClass();
        c1.Metod1();
        c1.Metod2();
        c1.Metod3();
        c1.Metod4();
        c1.Metod5();
    }
    var end1 = getTime();

    for (var i = 0; i < iterationCount; i++) {
        var c2 = new PrototypeClass();
        c2.Metod1();
        c2.Metod2();
        c2.Metod3();
        c2.Metod4();
        c2.Metod5();
    }
    var end2 = getTime();

    noPrototypeTimes.push((end1 - start) / 1000);
    prototypeTimes.push((end2 - end1) / 1000);
}

alert("NoPrototype times: " + noPrototypeTimes.toString().replace(/,/g, "    ") + "\n"
      + "Prototype times: " + prototypeTimes.toString().replace(/,/g, "    "));
  Результат. NoPrototype стиль вполне не плохо справляется с большим количеством итераций, но все же уступает Prototype стилю. На моей домашней машинке выдаются вот такие результаты:
   100  
     1 000  
     10 000  
     100 000  
IE8
NoPrototype
0,001
0,016
0,16
1,612
Prototype
0,001
0,012
0,101
1,017
FF 3.6
NoPrototype
0
0,006
0,068
0,709
Prototype
0
0,004
0,033
0,341
Chrome 8
NoPrototype
0
0,001
0,004
0,044
Prototype
0
0
0,002
0,021
А теперь вспомним наш последний проект с использование JavaScript, сколько раз в нем создаются объекты? Если до 10 000 созданий, то можно смело выбирать NoPrototypе стиль, иначе - стоит использовать Prototypе.

Комментарии