RequireJS bundles config vs bundling with modules

Question

1. What's the difference between requirejs bundles config and optimization with modules (i.e. multiple modules)? It seems to me that both produces the same thing - that is rather than creating a single optimized file, creating multiple optimized files where each file having multiple modules. Is my understanding correct? Is there any advantage using bundles over bundling with modules?

2. When optimized with r.js 'modules', it's possible to provide a 'create: true' configuration which creates a file if the module name is not an existing module. However I don't see that other modules referencing the module with 'create: true' changed accordingly.

   "modules": [{ "name": "some/existing/Module" }, { "name": "some/non/existing/path", "create": true, "include": ["x", "y"] }]

   In the above case how does the JS file "some/non/existing/path.js" produced by r.js loaded into browser?

Answer 1

1. Bundling all the modules in a single file may not be appropriate for all apps. As require JS is a on demand JS Module loader, some modules may not be needed at all the time. Splitting the bundles into separate bundles based on their usage pattern could increase on-load efficiency of the app.

2. In this case it produces a file that has modules "x", "y" and "some/non/existing/path" (as you have not mentioned skipModuleInsertion to be true) in the path "some/non/existing/path" like

define('x', [dependencies], function(){})

define('y', [dependencies], function(){})

define('some/non/existing/path', [dependencies], function(){})

This would be loaded from the requirejs config file. Require js inserts these configurations in the config file if you provide the file path in the bundlesConfigOutFile path. For more information refer this sample configuration file.