Javascript - Argumentos Vs Funciones anidadas Vs Performance

Question

Pregunta noob de JavaScript: cuál de las siguientes es una práctica recomendada y es amigable para el rendimiento, también da la bienvenida a cualquier otra sugerencia. Esta es la versión más simple del proyecto original. Habrá más de 20 variables y más de 10 funciones internas (por ejemplo, 'proceso' en el caso).

La ventaja del Método 1 es que no necesita enviar argumentos a las funciones sino que anida todas las funciones dentro de la función principal (posiblemente regenere todas las funciones internas para cada instancia de Foo). Mientras que el método 2 está libre de anidamiento de funciones pero requiere muchos argumentos. Tenga en cuenta que también habrá múltiples instancias del constructor Foo.

Método 1:

function Foo() { 
    var a = 1; 
    var b = 2; 
    var c = (a+b)/2; 
    var $element = $('#myElement'); 

    var process = function(){ 
     var x = a+b+c; 
     $element.css('left', x) 
     return x; 
    } 
    x = process(); 
} 

Método 2:

function Foo() { 
    var a = 1; 
    var b = 2; 
    var c = (a+b)/2; 
    var $element = $('#myElement'); 
    x = process (a, b, c, $element); 
} 

function process (a, b, c, $element){ 
    $element.css('left', x) 
    return x; 
} 

Answer 1

Las funciones separadas son definitivamente el camino a seguir para el rendimiento. Si bien hay situaciones en las que sería agradable tener un alcance variable de las funciones anidadas, el impacto en el rendimiento puede ser enorme si la función es grande.

Tenga en cuenta que cada vez que se llama a Foo, var proceso está reasignando toda la memoria para la nueva función que se está creando, en lugar de mantener la función en memoria y simplemente pasarle nuevos parámetros. Si la función es grande, va a ser una tarea bastante intensa para el intérprete de Javascript.

Éstos son algunos números duros que pueden ayudar también (Contiene comparaciones de rendimiento y parámetros reales que se pueden ejecutar en su propio navegador): http://jsperf.com/nested-functions-speed, http://jsperf.com/nested-named-functions/5

Answer 2

En realidad navegadores optimizan incluso funciones anidadas en las que las diferencias de rendimiento comparados a las funciones declaradas en el ámbito exterior se vuelven insignificantes.

Escribí my findings y creé un performance test para apoyar esta afirmación.

EDITAR: La prueba se rompió, after fixing la prueba muestra que todavía es más rápido no anidar funciones.