интернет браузер

Источник: Многие Веб-разработчики кропают горы кода на JavaScript, особливо в новом веке Web 2.0. Это мощная технология, однако большинство браузеров содержат здорово черепашью реализацию движка, и многим в какой-то момент приводится пересматривать код и пробовать сделать его быстротечнее. В этой заметке я поделюсь своим экспериментом и покажу несколько трюков, которые подсобят сделать Ваш код JavaScript эдаким живым, сколько это мыслимо. Это первая статья из серии, будьте на связи. Сценарий : Вы разрабатываете мощное приложение для Интернет, и Вам необходимо динамически загрузить элементы, используя AJAX, добавив их в текущий документ. По какой-то причине Вы не хотите (или не можете) использовать целиком сформированный HTML, и получаете настоящие в массив JavaScript. Я знаю два классических способах выполнить эдакую задачу: создать элементы, используя метод document.createElement() , и склеить HTML в строку, прикарманим ее свойству parentElement.innerHTML . натурально, Вы можете комбинировать оба способа. Рассмотрим эти подходы более детально. Не этакая уж и дурная производительность. Internet Explorer 6 самый черепаший - 1403 мс (но ведь это самый черепаший браузер в мире, истина?), другие же браузеры управились полно шустро ( 63 - 328 мс ). Ладно, однако чисто насчет создания элемента DOM прямиком из кода HTML? трудится много славнее в Internet Explorer 6 ( 1134 мс ), но вообще не трудится в иных браузерах. Блин! натурально, Вы можете добавить блок и создать элементы, используя первый подход в блоке для других браузеров. однако у меня уписывать решение пооптимальнее. which holds all child nodes as HTML string. Вау, я велико изумлен, сколько неторопливой может быть процедура добавления элементов ( 11391 - 307938 мс )! Забавный результат, не истина ли? А все оттого, что браузеры пробуют отрисовать список после всякого обновления, и это велико задерживает работу. Небольшая оптимизация: Все браузеры показали отличный плод ( 31 - 109 мс ), но Internet Explorer по-прежнему черепаший - 10994 мс . Я нашел решение, коей трудится здорово быстротечно во всех браузерах: создать массив кусов HTML, и затем слепить его используя порожнюю строку в качестве разделителя: Это самый проворный подход для Internet Explorer 6 - 400 мс , и полно проворный для других браузеров ( 31 - 125 ms ). Why Im not saying fastest in case of Firefox? I added another test to make in cleaner: Вот итоги в облике таблицы и диаграммы. Вы можете посмотреть тест и получить собственный итоги производельности . век используйте методы DOM, дабы Ваш код отвечал стандартам. Этот подход владеет троякую производительность и трудится во всех браузерах. Если Вам надобна самая возвышенная скорость, используйте подход , кой представляет самым живым в настоящем тесте. (даже если Вам необходимо добавить маааааааленький элементик). Opera - самый проворный браузер в мире, однако Internet Explorer 7 тоже полно шустр, а вот Firefox 2.0 удивил своей малорослой производительностью. вовек не веруйте фанатикам вроде меня, и замеряйте производительность различных подходов сами (но не болейте, Microsoft не проплатили мне рекламу своего браузера). доля 1: Добавление элементов DOM в документ