Reputation: 493
In requirejs, you can define a module without setting it's name literally, for example:
//in a.js
define([/*deplist*/],function(){
/*do something*/
});
//in b.js
define([/*deplist*/],function(){
/*do something*/
});
And requirejs will set their module name according to their file name("a" and "b").
Requirejs add all <script>
tag your application needs, they're not loaded sequentially(as the network timeline said).
when a module called define
to define itself, it has no knowledge of it's module name, then it put itself to the defQueue
waited for initialization. The initialization will be done in load event handler, because in event handler function, the node refercence is accessible, and the module name is record on node attribute(like this: <script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="a" src="./a.js"></script>
).
Here's the problem, we cannot ensure the order of module calling define
identical to module's node load
event triggering. Then how can module name mapped to module factory correctly?
Upvotes: 2
Views: 529
Reputation: 493
It turns out the js evaluating and its referencing node "load" event triggering order is coincidental.
After a module js file loaded, the content inside it will be evaluated(not sure when but will be evaluated in the order of js file loaded), then requirejs will push the factory and dependency list in a FIFO queue. Browser will trigger node load event in the same order of js file loaded, and requirejs link the module id and it's factory in the "load" event handler.
For example, if a.js is loaded before b.js, then a.js 's content will be evaluated no later than b.js's, and a.js's "load" event handler will be called no later than b.js's. Then it can be sure that module's id mapped will their factory and dependency list.
Upvotes: 1