Lazy boot modules

Question

in template templates, it looks like the modules are preloaded

(see code below)

return [ require('./baseModule/module'), require('./sampleModule2/module'), require('./customerModule/module'), require('./orderSearchModule/module'), require('./orderListModule/module'), require('./mainMenuModule/module') ]; 

what is the effect on this when it comes to large-scale web applications (modular heavy web applications). Is there a way for lazy loading modules in templates?

Answer 1

A Java script does not have a reflection type for loading things. Any module that needs to be loaded must be registered somewhere. This is why modules (auxiliary contexts) are loaded as shown below:

 appContext.loadChildContexts(moduleContexts); 

(in src / application.js)

But the code you have above is for AMD requirejs modules. This is mainly an import of various JS scripts (each of which is code for modules). With requireJS AMD scripts (your source code) are not lazy loaded, but preloaded. This makes sense, since the source code of the application must be available in the browser for execution. On the other hand, when you optimize JS, we will still create a single script containing all of your source code. Then it makes no sense to have separate script files or lazy loading the source code.

But lazy loading should apply to behavior (don't load code). This is why the components of the user interface (ViewTemplate) are created only by the "activate ()" method. They are created only when users require it. This is lazy loading behavior, so application rendering time is shorter.

  this.activate = function(parent, params) { // if panel is not created, lets create it and initiate bindings if (!panel) { panel = new Boiler.ViewTemplate(parent, template, nls); ... } vm.initialize(params.name); panel.show(); }