Description
Packing everying in one file causes some problems:
- You have to re-pack the whole thing everytime you modify a single file
- When an error is reported during execution, it does not reports the line number and file name of the real source file
- Multiple browserified modules can't share dependencies: they are packed independently in each module; as a result they are downloaded twice.
This is a feature request to add support (as a browserify option) for using asynchronous loading instead of packing everything in a single file.
This would solve all the problems described above: dev becomes easier, bandwidth is saved, and pages load faster (because scripts are loaded asynchronously).
Most node modules are currently using synchronous loading, but it would be possible to convert a script like that:
var http = require('http');
function doRequest() {
var url = require('url');
....
}
exports.doRequest = doRequest;
To something like this:
define(['http', 'url'], function(http, url) {
function doRequest() {
....
}
exports.doRequest = doRequest;
return exports;
});
Or even easier (just wrap the unmodified script with a header and footer):
define(['http', 'url'], function() {
// now that http and url modules are loaded, require('http') and require('url') can be used directly
// no need to modify the script :-)
var http = require('http');
function doRequest() {
var url = require('url');
....
}
exports.doRequest = doRequest;
return exports;
});
Optimization
Such asynchronous modules can still be packed together in a single javascript file for reducing the number of HTTP requests in production.
This is done by just adding the module name as first argument of define
(define('moduleName', ['dependency'], func)
) and concatenating all modules.