Najbardziej efektywny sposób łączenia ciągów w JavaScript?

W JavaScript mam pętlę, która ma wiele iteracji, aw każdej iteracji tworzę ogromny ciąg z wieloma +=operatorami. Czy istnieje wydajniejszy sposób tworzenia łańcucha? Myślałem o stworzeniu dynamicznej tablicy, w której będę dodawać do niej ciągi, a następnie wykonywać łączenie. Czy ktoś może wyjaśnić i podać przykład najszybszego sposobu, aby to zrobić?

Wydaje się, że bazuje na testach porównawczych JSPerf , według których używanie +=jest najszybszą metodą, choć niekoniecznie w każdej przeglądarce.

Wydaje się , że do budowania łańcuchów w DOM, lepiej jest najpierw połączyć łańcuch, a następnie dodać go do DOM, zamiast dodawać go iteracyjnie do DOM. Powinieneś jednak porównać swój własny przypadek.

(Dzięki @zAlbee za korektę)

Nie mam komentarza do samej konkatenacji, ale chciałbym zaznaczyć, że sugestia @Jakub Hampl:

Do budowania łańcuchów w DOM, w niektórych przypadkach lepiej byłoby iteracyjnie dodawać do DOM, zamiast dodawać od razu ogromny ciąg.

jest błędne, ponieważ opiera się na błędnym teście. Ten test w rzeczywistości nigdy nie dołącza do DOM.

Ten naprawiony test pokazuje, że utworzenie całego ciągu na raz przed jego renderowaniem jest dużo, DUŻO szybsze. To nawet nie jest konkurs.

(Przepraszam, że to osobna odpowiedź, ale nie mam jeszcze wystarczającej liczby przedstawicieli, aby komentować odpowiedzi).

Trzy lata minęły od odpowiedzi na to pytanie, ale i tak udzielę odpowiedzi :)

W rzeczywistości przyjęta odpowiedź nie jest w pełni poprawna. Test Jakuba wykorzystuje zakodowany ciąg znaków, który pozwala silnikowi JS na optymalizację wykonywania kodu (V8 Google jest w tym naprawdę dobry!). Ale gdy tylko użyjesz całkowicie losowych ciągów ( tutaj jest JSPerf ), konkatenacja ciągów będzie na drugim miejscu.

Możesz również wykonać konkatację ciągów z literałami szablonu . Zaktualizowałem testy JSPerf innych plakatów, aby je uwzględnić.

for (var res = '', i = 0; i < data.length; i++) {
  res = `${res}${data[i]}`;
}