Comprender cuándo y cómo utilizar Require.JS

Question

He comenzado a trabajar con Require.JS y estoy un poco confuso en los casos apropiados en que se debe utilizar, así como la forma correcta de usarlo en esos casos.

He aquí cómo Actualmente tengo cosas establecido con Require.JS. Tengo dos funciones, functionA() y functionB(). Ambas funciones requieren una función adicional, functionC() para funcionar correctamente.

sólo desea cargar functionC() cuando sea necesario, es decir, cuando funciónA() o funciónB() va a ser llamado. Así que tengo los siguientes archivos:

functionC.js

functionC(){ 
    //do stuff 
} 

functionA.js

functionA(){ 
    define(['functionC'],function(){ 
    //functionC() is loaded because it is listed as a dependency, so we can proceed 
    //do some functionA() stuff 
    }); 
} 

functionB.js

functionB(){ 
    define(['functionC'],function(){ 
    //functionC() is loaded because it is listed as a dependency, so we can proceed 
    //do some functionB() stuff 
    }); 
} 

Entonces, ¿está configurado correctamente? Y si termino llamando tanto a functionA() como a functionB() en la misma página, ¿se está trabajando extra ya que ambos cargan el archivo functionC.js? Si es así, ¿es eso un problema? Y si es así, ¿hay alguna forma de configurarlo para que primero comprueben si FunctionC.js ya se ha cargado y solo lo cargan si no lo ha estado? Finalmente, ¿es este un uso apropiado de Require.JS?

Answer 1

define() sólo se debería usar para definir un módulo. Para el ejemplo anterior, donde una pieza de código debe ser cargado dinámicamente, utilizando require() es más apropiado:

functionA.js

functionA(){ 
    require(['functionC'],function(functionC){ 
    //use funcC in here to call functionC 
    }); 
} 

algunas notas:

• require([]) es asíncrona, por lo que si la persona que llama de functionA espera un valor de retorno de esa función, es probable que haya errores. Lo mejor es que functionA acepte una devolución de llamada que se llama cuando functionA se hace con su trabajo.
• El código anterior llamará require() para cada llamada a functionA; sin embargo, después de la primera llamada, no se aplica ninguna penalización para cargar functionC.js, solo se carga una vez. La primera vez que se llama a require(), cargará functionC.js, pero el resto del tiempo, RequireJS sabe que ya está cargado, por lo que llamará a la función function(functionC){} sin solicitar functionC.js nuevo.

Answer 2

Puede encontrar detalles sobre RequireJS y JavaScript modularidad aquí: JavaScript modularity with RequireJS (from spaghetti code to ravioli code)