is de + operator minder performant dan StringBuffer.append()

In mijn team doen we gewoonlijk de aaneenschakeling van tekenreeksen als volgt:

var url = // some dynamically generated URL
var sb = new StringBuffer();
sb.append("<a href='").append(url).append("'>click here</a>");

Uiteraard is het volgende veel leesbaarder:

var url = // some dynamically generated URL
var sb = "<a href='" + url + "'>click here</a>";

Maar de JS-experts beweren dat de operator +minder presteert dan StringBuffer.append(). Is dit echt waar?

Antwoord 1, autoriteit 100%

Uw voorbeeld is geen goed voorbeeld omdat het zeer onwaarschijnlijk is dat de uitvoering aanzienlijk zal verschillen. In uw voorbeeld zou leesbaarheid de prestaties moeten overtroeven, omdat de prestatiewinst van de een ten opzichte van de ander verwaarloosbaar is. De voordelen van een array (StringBuffer) worden pas duidelijk als u veel aaneenschakelingen uitvoert. Zelfs dan kan uw kilometerstand erg afhankelijk zijn van uw browser.

Hier is een gedetailleerde prestatieanalyse die de prestaties laat zien met behulp van alle verschillende JavaScript-aaneenschakelingsmethoden in veel verschillende browsers; Stringprestaties en analyse

Meer:
Ajaxian >> Stringprestaties in IE: Array.join vs += vervolg

Antwoord 2, autoriteit 45%

Internet Explorer is de enige browser die hier in de wereld van vandaag echt last van heeft. (Versies 5, 6 en 7 waren dog slow. 8 vertoont niet dezelfde degradatie.) Bovendien wordt IE langzamer en langzamer naarmate je string langer is.

Als je lange strings moet samenvoegen, gebruik dan zeker een array.join-techniek. (Of een StringBuffer-wikkel eromheen, voor de leesbaarheid.) Maar als je strings kort zijn, maak je geen zorgen.

Antwoord 3, autoriteit 36%

Ja, het is waar, maar het zou je niets kunnen schelen. Ga met degene die gemakkelijker te lezen is. Als je je app moet benchmarken, richt je dan op de knelpunten.

Ik vermoed dat het samenvoegen van strings niet je bottleneck zal zijn.

Antwoord 4, autoriteit 31%

Akkoord met Michael Haren.

Overweeg ook het gebruik van arrays en join als prestatie inderdaad een probleem is.

var buffer = ["<a href='", url, "'>click here</a>"];
buffer.push("More stuff");
alert(buffer.join(""));

Antwoord 5, autoriteit 18%

Probeer dit:

var s = ["<a href='", url, "'>click here</a>"].join("");

Antwoord 6, autoriteit 8%

Zoals sommige gebruikers al hebben opgemerkt: dit is niet relevant voor kleine strings.

En nieuwe JavaScript-engines in Firefox, Safari of Google Chrome optimaliseren zo

"<a href='" + url + "'>click here</a>";

is zo snel als

["<a href='", url, "'>click here</a>"].join("");

Antwoord 7, autoriteit 8%

JavaScript heeft geen native StringBuffer-object, dus ik neem aan dat dit afkomstig is uit een bibliotheek die u gebruikt, of een functie van een ongebruikelijke hostomgeving (d.w.z. geen browser).

Ik betwijfel of een bibliotheek (geschreven in JS) iets sneller zou produceren, hoewel een native StringBuffer-object dat wel zou kunnen. Het definitieve antwoord kan worden gevonden met een profiler (als u in een browser werkt, zal Firebug u een profiler leveren voor de JS-engine die u in Firefox vindt).

Antwoord 8, autoriteit 6%

In de woorden van Knuth: “voortijdige optimalisatie is de wortel van alle kwaad!” De kleine onverschilligheid hoe dan ook zal uiteindelijk waarschijnlijk niet veel effect hebben; Ik zou de beter leesbare kiezen.

Antwoord 9, autoriteit 4%

De gemakkelijker te lezen methode bespaart mensen waarneembare hoeveelheden tijd bij het bekijken van de code, terwijl de “snellere” methode alleen onmerkbare en waarschijnlijk verwaarloosbare hoeveelheden tijd verspilt wanneer mensen op de pagina browsen.

Ik weet dat dit een zwak bericht is, maar ik heb per ongeluk iets heel anders gepost omdat ik dacht dat dit een ander onderwerp was en ik niet weet hoe ik berichten moet verwijderen. Mijn slechte…

Antwoord 10, autoriteit 3%

Het is vrij eenvoudig om een ​​snelle benchmark op te zetten en variaties in Javascript-prestaties te bekijken met jspref.com. Die er waarschijnlijk niet was toen deze vraag werd gesteld. Maar voor mensen die over deze vraag struikelen, moeten ze de site eens bekijken.

Ik heb een snelle test gedaan van verschillende methoden van aaneenschakeling op http://jsperf.com/string -concat-methods-test.

Antwoord 11, autoriteit 2%

Ik gebruik graag een functionele stijl, zoals:

function href(url,txt) {
  return "<a href='" +url+ "'>" +txt+ "</a>"
}
function li(txt) {
  return "<li>" +txt+ "</li>"
}
function ul(arr) {
  return "<ul>" + arr.map(li).join("") + "</ul>"
}
document.write(
  ul(
    [
      href("http://url1","link1"),
      href("http://url2","link2"),
      href("http://url3","link3")
    ]
  )
)

Deze stijl ziet er leesbaar en transparant uit. Het leidt tot het maken van hulpprogramma’s die herhaling in code verminderen.

Dit heeft ook de neiging om automatisch tussenliggende tekenreeksen te gebruiken.

Antwoord 12

Voor zover ik weet, impliceert elke aaneenschakeling een hertoewijzing van het geheugen. Het probleem is dus niet de operator die het gebruikt, de oplossing is om het aantal aaneenschakelingen te verminderen. Voer bijvoorbeeld de aaneenschakelingen uit buiten de iteratiestructuren wanneer je kunt.

Antwoord 13

Ja, volgens de gebruikelijke benchmarks. Bv: http://mckoss.com/jscript/SpeedTrial.htm.

Maar voor de kleine strings is dit niet relevant. Het gaat u alleen om uitvoeringen op zeer grote snaren. Bovendien zit de bottleneck in de meeste JS-scripts zelden op de snaarmanipulaties, omdat er niet genoeg van is.

Je kunt maar beter naar de DOM-manipulatie kijken.