Игры с производительностью if...else и switch в JavaScript

gaidar — Fri, 25 Apr 2008 17:49:51 GMT

Решил немножко поиграть с JavaScript и тем, насколько методики по улучшению производительности работают в нем. Пробовать очевидные вещи вроде вычисляния выражений в условии цикла, приводящим к постоянным вычислениям одного и того же значения, или уменьшения повторений одинаковых выражений не интересно, поэтому я решил попробовать поиграть со switch вместо комбинаций if...else в разных браузерах (IE 7 и FireFox 2).

Для получения результатов тестов используем простой код (Test.html):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Test Page</title>
    <script type="text/javascript">
    function TestCode()
    {
        // <code for testing goes here />
    }
    function Test()
    {
        var i = 0;
        var total = 0;
        for(i = 0; i < 10; i++)
        {
           var sTime = new Date();
           TestCode();
           var eTime = new Date();
           total += (eTime - sTime);
        }
        testResults.innerHTML = (total / 10) + " ms";
    }
    </script>
</head>
<body>
    <div>
        <p>
            <span id="testResults"></span>
        </p>
        <p>
            <input type="button" onclick="Test()" value="Test" />
        </p>
    </div>
</body>
</html>

Начнем с такого фрагмента, где используется последовательность if...else:

var test = 5;
var res = 0;
var i = 0;

for (i=0; i < 100000; i++)
{
if (test == 0) {res = test}
else if(test == 1) {res = test}
else if(test == 2) {res = test}
else if(test == 3) {res = test}
else if(test == 4) {res = test}
else if(test == 5) {res = test}
else if(test == 6) {res = test}
else if(test == 7) {res = test}
else if(test == 8) {res = test}
else if(test == 9) {res = test}
else if(test == 10) {res = test}
}

И сравним его с вот таким со switch:

var test = 5;
var res = 0;
var i = 0;

for(i = 0; i < 100000; i++)
{

switch (test) {
case 0 : res = test; break;
case 1 : res = test; break;
case 2 : res = test; break;
case 3 : res = test; break;
case 4 : res = test; break;
case 5 : res = test; break;
case 6 : res = test; break;
case 7 : res = test; break;
case 8 : res = test; break;
case 9 : res = test; break;
case 10 : res = test; break;
}

}

И со switch с переставленными случайно значениями:

var test = 5;
var res = 0;
var i = 0;

for(i = 0; i < 100000; i++)
{
switch (test) {
case 3 : res = test; break;
case 8 : res = test; break;
case 7 : res = test; break;
case 4 : res = test; break;
case 1 : res = test; break;
case 5 : res = test; break;
case 10 : res = test; break;
case 7 : res = test; break;
case 6 : res = test; break;
case 2 : res = test; break;
case 9 : res = test; break;
}
}

Вариант	IE7.0.60001.18000	FireFox 2.0.0.14
if...else	46.7 ms	52.9 ms
switch	45.6 ms	13.8 ms
switch 2	45.6 ms	19.6 ms

Как видно из результатов, IE показывает стабильную производительность и не реагирует на оптимизации (и их кривизну :)). В то же время FireFox очень чувствителен к использованию switch вместо if. Теперь вот надо будет раскопать почему так происходит. Кто-нибудь может быть уже интересовался? ;)

Гайдар Магдануров : JavaScript

Игры с производительностью if...else и switch в JavaScript