append javascript

es el operador+menos eficiente que StringBuffer.append()

Question

En mi equipo, generalmente hacemos una concatenación de cadenas como esta:

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

Obviamente, lo siguiente es mucho más legible:

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

Pero los expertos de JS afirman que el operador + es menos StringBuffer.append() que StringBuffer.append() . ¿Es esto realmente cierto?

Answer 1

Como ya han señalado algunos usuarios: esto es irrelevante para cadenas pequeñas.

Y los nuevos motores de JavaScript en Firefox, Safari o Google Chrome se optimizan

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

es tan rápido como

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

Answer 2

De acuerdo con Michael Haren .

También considere el uso de matrices y únete si el rendimiento es realmente un problema.

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

Answer 3

El método más fácil de leer ahorra a los humanos cantidades perceptibles de tiempo al mirar el código, mientras que el método "más rápido" solo desperdicia cantidades de tiempo imperceptibles y probablemente insignificantes cuando las personas navegan por la página.

Sé que esta publicación es coja, pero accidentalmente publiqué algo completamente diferente pensando que este era un hilo diferente y no sé cómo eliminar publicaciones. Mi error...

Answer 4

En palabras de Knuth, "la optimización prematura es la raíz de todo mal". La pequeña deferencia en ambos sentidos probablemente no tendrá mucho efecto al final; Elegiría el más legible.

Answer 5

Es bastante fácil establecer un punto de referencia rápido y comprobar las variaciones de rendimiento de Javascript usando jsPerf . Lo cual probablemente no existía cuando se hizo esta pregunta. Pero para las personas que tropiezan con esta pregunta, deben tomar alook en el sitio.

Hice una prueba rápida de varios métodos de concatenación en http://jsperf.com/string-concat-methods-test .

Answer 6

Hasta donde sé, cada concatenación implica una reasignación de memoria. Entonces, el problema no es que el operador solía hacerlo, la solución es reducir el número de concatenaciones. Por ejemplo, haz las concatenaciones fuera de las estructuras de iteración cuando puedas.

Answer 7

Internet Explorer es el único navegador que realmente sufre de esto en el mundo de hoy. (Las versiones 5, 6 y 7 fueron dog slow. 8 no muestran la misma degradación). Además, IE se vuelve cada vez más lenta cuanto más larga es la cadena.

Si tiene cadenas largas para concatenar, entonces definitivamente use una técnica de combinación. (O algo de envoltura StringBuffer alrededor de esto, para facilitar la lectura). Pero si tus cadenas son cortas, no te molestes.

Answer 8

JavaScript no tiene un objeto StringBuffer nativo, por lo que supongo que esto es de una biblioteca que está utilizando, o una característica de un entorno host inusual (es decir, no un navegador).

Dudo que una biblioteca (escrita en JS) produzca algo más rápido, aunque un objeto nativo StringBuffer podría. La respuesta definitiva se puede encontrar con un generador de perfiles (si está ejecutando en un navegador, Firebug le proporcionará un generador de perfiles para el motor JS que se encuentra en Firefox).

Answer 9

Me gusta usar un estilo funcional, como por ejemplo:

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")
    ]
  )
)

Este estilo parece legible y transparente. Conduce a la creación de utilidades que reduce la repetición en el código.

Esto también tiende a usar cadenas intermedias automáticamente.

Answer 10

Prueba esto:

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

Answer 11

Sí, de acuerdo con los puntos de referencia habituales. EG: http://mckoss.com/jscript/SpeedTrial.htm .

Pero para las cuerdas pequeñas, esto es irrelevante. Solo le importará el rendimiento en cadenas muy grandes. Además, en la mayoría de las secuencias de comandos de JS, el cuello de la botella rara vez se manipula con cuerdas, ya que no hay suficiente.

Será mejor que mire la manipulación DOM.

Answer 12

Sí, es cierto, pero no deberías preocuparte. Ve con el que es más fácil de leer. Si tiene que comparar su aplicación, concéntrese en los cuellos de botella.

Supongo que la concatenación de cadenas no será tu cuello de botella.

Answer 13

Su ejemplo no es bueno, ya que es muy poco probable que el rendimiento sea significativamente diferente. En su ejemplo, la legibilidad debe prevalecer sobre el rendimiento porque la ganancia de rendimiento de uno frente al otro es insignificante. Los beneficios de una matriz (StringBuffer) solo son aparentes cuando se hacen muchas concatentaciones. Incluso entonces su kilometraje puede muy dependiendo de su navegador.

Aquí hay un análisis de rendimiento detallado que muestra el rendimiento utilizando todos los diferentes métodos de concatenación de JavaScript en muchos navegadores diferentes; Rendimiento de cadena un análisis

Más:
Ajaxian >> String Performance en IE: Array.join vs + = continuado