Оптимизация JavaScript для Internet Explorer

Question

Хорошо известно, что по сравнению с Chrome, Safari (Webkit) или Firefox (Mozilla) движки Javascript Internet Explorer значительно отстают по производительности, в частности IE 8 и старше.

При разработке веб-приложения со значительной функциональностью javascript IE работает намного хуже, чем другие.

Существуют ли какие-либо методы, которые могут помочь улучшить ваш JavaScript-код, поэтому разница между хорошими исполнителями (не IE) и плохими (IE) не так велика?

Answer 1

Одним из распространенных способов оптимизации производительности является кэширование значения 'max' для циклов.

Итак, допустим, вам нужно перебрать массив с именем sampleArray. Вы можете оптимизировать следующее утверждение:

var sampleArray = [3, 10, 12, 5, 9];

for(var i = 0; i < sampleArray.length; i++){
   var currentElement = sampleArray[i];
  // so something wit element
}

, изменив его на:

for(var i = 0, max = sampleArray.length; i < max; i++){
       var currentElement = sampleArray[i];
      // so something wit element
}

Это показало довольно значительное увеличение производительности во всех браузерах. В частности, IE7 показал увеличение производительности в 190 раз при использовании этого шаблона (с High Performance Javascript )

Answer 2

Другая пара общих решений:

Кэшировать часто используемые узлы DOM , не пересчитывать их снова в той же функции.Например, вместо

$(id).parentNode.something();
$(id).parentNode.somethingOther();

используйте

var e = $(id).parentNode;
e.something();
e.somethingOther();

Кэшируйте часто используемые объекты из внешней области видимости.Например, вместо

if (this.options.type == 'a') {
    // ...
} else if (this.options.type == 'b') {
    // ...
}

используйте

var type = this.options.type;
if (type == 'a') {
    // ...
} else if (type == 'b') {
    // ...
}

Это также окажет положительное влияние на размер кода до и после минимизации.

Answer 3

а.Один из способов повысить производительность в старых версиях IE - использовать RAW JavaScript для создания элементов DOM вместо jQuery.

пример -

(function () {
  var rosterContainer = document.getElementByID("roster");
  var memberContainer = document.createElement("div");

  $(memberContainer).addClass("one_fourth alpha hentry")
                    .attr("id", mName.replace(/\s+/g," "))
                    .appendTo($(rosterContainer));
})();

b.Вы также можете изменить свой пользовательский интерфейс для браузеров IE.

Пример - мой сайт использует тяжелые плагины JS / jquery для загрузки больших фонов и показа их в виде слайд-шоу с альфа-анимацией.Но для моих пользователей IE я не загружаю JS или плагин или фоновые изображения - я просто показываю статический заголовок bg.

, вы можете использовать загрузчики, такие как yepnope.js, чтобы загрузить оптимизированный JSдля IE

c.Убедитесь, что пользовательский интерфейс вашего сайта полностью функционален без JavaScript.Это всегда хорошее место для начала.

Answer 4

Я думаю, что разумным решением для этого является Google Chrome Frame
Это просто позволяет использовать Chrome Frame в IE и не использовать его в браузеры без IE .

Инструменты производительности и разработки JavaScript для IE:
Поддержка Microsoft: статья по производительности Internet Explorer - http://support.microsoft.com/kb/982891