Статьи

Высокопроизводительная конкатенация строк в JavaScript

Конкатенация, или соединение строк, является важным средством в любом языке программирования. Это особенно важно в веб-приложениях, так как строки регулярно используются для генерации вывода HTML. Некоторые языки предлагают классы быстрой обработки строк, такие как StringBuilder в .NET и StringBuffer / StringBuilder в Java.

Существует несколько способов объединения строк в JavaScript:

str = "a" + "b"; str += "c"; str = str.concat("d", "e"); 

Вы также можете присоединиться к массиву строк:

 str = ["a", "b", "c", "d", "e"].join(""); 

Если вы присоединяете только несколько строк, вы должны использовать тот метод, который наиболее практичен. Повышение или снижение производительности будет незначительным во всех браузерах.

Конкатенация многих строк

Рассмотрим следующие функционально идентичные примеры. Первый использует оператор конкатенации строк:

 // standard string append var str = ""; for (var i = 30000; i > 0; i--) { str += "String concatenation. "; } 

Второй использует массив массива:

 // array join var str = "", sArr = []; for (var i = 30000; i > 0; i--) { sArr[i] = "String concatenation. "; } str = sArr.join(""); 

Который выполнит самый быстрый?

Некоторые разработчики предполагают, что оператор конкатенации работает быстрее, потому что он использует меньше кода и не требует массива, который удваивает требования к памяти. Для других общепринятая мудрость гласит, что объединение массивов происходит быстрее — это более эффективно для памяти в интерпретаторе JavaScript.

Правда довольно сложнее. Во всех самых последних браузерах любой из этих методов является быстрым и завершится в течение 80 мс на ПК среднего уровня. Вот результаты моих совершенно ненаучных тестов:

  • Chrome 6.0 : стандартное добавление строк обычно выполняется быстрее, чем объединение массивов, но оба выполняются менее чем за 10 мс.
  • Opera 10.6 : опять же, стандартные добавления выполняются быстрее, но разница незначительна — часто 15 мс по сравнению с 17 мс для соединения с массивом.
  • Firefox 3.6 : браузер обычно занимает около 30 мс для любого метода. Объединения массивов обычно имеют преимущество, но только на несколько миллисекунд.
  • IE 8.0 : стандартное добавление требует 30 мс, тогда как соединение с массивом более чем в два раза — обычно 70 мс.
  • Safari 5.0.1 : как ни странно, стандартное добавление занимает не более 5 мс, но соединение с массивом более чем в десять раз медленнее — 55 мс.

Последние механизмы JavaScript оптимизированы для операторов конкатенации строк. Соединения с массивом остаются быстрыми, но без увеличения производительности.

Мухи в мази

IE7 является третьим по популярности браузером в мире с долей рынка 14%. IE6 составляет еще 8%. Нет необходимости читать дальше, если вы отказались от поддержки этих устаревших приложений.

Все еще здесь? Это шокер: IE7 и ниже используют обработчик конкатенации, который многократно копирует строки и вызывает экспоненциальное увеличение времени и использования памяти. Выполнение кода с использованием оператора конкатенации занимает около 2,5 минут (150 000 мс), и браузер по-прежнему не отвечает на запросы. Для сравнения, присоединение к массиву выполняется менее чем за 200 мс — это более чем в 800 раз быстрее.

Если вы поддерживаете IE7, объединения массивов остаются лучшим методом для объединения большого количества строк.

Как насчет PHP? Скоро настройтесь на результаты испытаний …