4 ms·

This is the worst thing about CommonJS. By default, it can not work in browsers - the most common environment for javascript. You either need a special loader

by illumen 16y ago

This is the worst thing about CommonJS. By default, it can not work in browsers - the most common environment for javascript. You either need a special loader, or you need to package the code into a wrapper. The other bad part about it is that it is not async. Which means your code blocks whilst it loads. Loading code off a slow hard disk, or off the network? Blocked. I'm not sure why they have made these design decisions. CommonJS seems a step backwards to me.

arthurschreiber 16y ago
CommonJS also has async module specifications, see http://wiki.commonjs.org/wiki/Modules/Transport/D http://wiki.commonjs.org/wiki/Modules/Transport/D and/or http://wiki.commonjs.org/wiki/Modules/AsynchronousDefinition http://wiki.commonjs.org/wiki/Modules/AsynchronousDefinition. And by using a loader (as you mentioned) these formats also work in browsers.
diamondhead 16y ago
The only limitation with CommonJS' Modules spec is that we can't import CommonJS modules by writing script tags during development. On the other hand, CommonJS provides lazy evolution for web apps, with a great module mechanism design. BTW It's possible to load CommonJS code asynchronously by splitting your built code into separate parts. You may be interested at the other project I'm working on, named DOMLoader (http://github.com/azer/domloader http://github.com/azer/domloader) Regards
tlrobinson 16y ago
There are a lot of misconceptions about CommonJS modules in the browser. You've touched on most of them. Of course you need a loader or packaging script, any module system that wants to handle dependencies will. Script tags are inadequate for anything except the simplest cases. You can load your modules asynchronously, even though the main "require()" API is synchronous. Simply load the modules and their dependencies up front before executing them. This is what we've been doing for years in the Objective-J loader, and several CommonJS browser loaders already do it. Also, I believe "require.async(id, callback)" is part of the spec now too, and they're working on an "async module definition" spec, which allows loading in script tags with minimal boilerplate ("require.def(id, function() { /module/ })")

by illumen 16y ago

arthurschreiber 16y ago

CommonJS also has async module specifications, see http://wiki.commonjs.org/wiki/Modules/Transport/D http://wiki.commonjs.org/wiki/Modules/Transport/D and/or http://wiki.commonjs.org/wiki/Modules/AsynchronousDefinition http://wiki.commonjs.org/wiki/Modules/AsynchronousDefinition. And by using a loader (as you mentioned) these formats also work in browsers.

diamondhead 16y ago

The only limitation with CommonJS' Modules spec is that we can't import CommonJS modules by writing script tags during development. On the other hand, CommonJS provides lazy evolution for web apps, with a great module mechanism design. BTW It's possible to load CommonJS code asynchronously by splitting your built code into separate parts. You may be interested at the other project I'm working on, named DOMLoader (http://github.com/azer/domloader http://github.com/azer/domloader) Regards

tlrobinson 16y ago

There are a lot of misconceptions about CommonJS modules in the browser. You've touched on most of them. Of course you need a loader or packaging script, any module system that wants to handle dependencies will. Script tags are inadequate for anything except the simplest cases. You can load your modules asynchronously, even though the main "require()" API is synchronous. Simply load the modules and their dependencies up front before executing them. This is what we've been doing for years in the Objective-J loader, and several CommonJS browser loaders already do it. Also, I believe "require.async(id, callback)" is part of the spec now too, and they're working on an "async module definition" spec, which allows loading in script tags with minimal boilerplate ("require.def(id, function() { /module/ })")