The main issue here is that we need to stop viewing IO in the browser as
equivalent module loading. IO in the browser is more along the lines of
installation. Doing an asynchronous require in the browser, is more akin to:
require('child_process').exec('npm install moduleA', function(err) {
var moduleA = require('moduleA');
});
_This is an important distinction as I feel it's at the root of most of the
contention b/w node's CJS modules and AMD._
An asynchronous module definition pattern is necessary in the browser to
remove the one-to-one IO to module coupling. In other words, an async
module definition allows us to define multiple modules per IO request
(<script>). Conveniently, it also allows us to separate parse from
execution, a necessary distinction in large client-side apps where parsing
a large module can noticeably degrade performance. Even Browserify
recognizes this and supports the async definition pattern. Also, wrapping
node CJS modules in a define is trivial, and there's a whole suite of build
tools for it.
As others have pointed out, it's absurd to necessitate front-loading of all
source/modules. This is a non-starter for any non-trivial consumer facing
app, and regardless, _it's just simply inferior to lazy loading
(installing) modules not immediately necessary_. Fortunately, the AMD spec
supports both, so you can front-load or lazy-load (install/async require),
with no affect on your module definitions.
Cheers,
Adam Crabtree
On Thu, Feb 9, 2012 at 2:58 PM, Phoscur <[email protected]> wrote:
> Then it depends on what you want to build. I want a fat client
> WebApplication. Maybe you don't want 200kb JavaScript on your frontpage.
> But for the WebApplication I trade small loads on each click against a
> longer loading time on initialisation.
>
>
> Am 09.02.2012 23:45, schrieb Taka Kojima:
>
> I understand how browserify works, maybe I didn't clarify well enough.
>
> Yes, you don't have to inject moduleZ into moduleA, B and C if you put
> them all in the same file and load that js file upfront.
>
> This is not scalable though. If my entire site has 200kb of JS
> throughout the entire site, requiring users to download all 200kb upon page
> load is well, non-sensical.
>
> You should modularize your code so that you only require the JS for
> specific pages/functionality when you actually need it.
>
> This is accomplished via something like:
>
> require("someFile", function(someModule){
>
> });
>
> Browserify does not handle this use case at all. Yes, if you want to
> concat and minify all your js into a single file and load that file
> everywhere, sure, go right ahead, but you're doing it wrong.
>
> Taka
>
> On Thu, Feb 9, 2012 at 2:27 PM, Phoscur <[email protected]> wrote:
>
>> I think you haven't actually understood how browserify/browserbuild work:
>> 1. load source files
>> 2. wrap a function around them
>> 3. concat all of them together and add a custom require() emulating
>> node's require
>> 4. instead of many script tags, insert one with the big file
>>
>> Now when moduleA requires moduleZ, the moduleZ function wrapper is
>> executed exactly once when it's needed the first time (lazyload). Why
>> should the call to function wrapper be asynchronous in this case??
>>
>> Using browserify, you have to inject moduleZ into moduleA, moduleB and
>> moduleC. If moduleZ is 30kb of javascript, this is a huge issue.
>>
>> inject what? What do filesizes matter here?
>>
>>
>> Am 09.02.2012 23:11, schrieb Taka Kojima:
>>
>> It's not really AJAX, it's just loading in the js files by injecting
>> <script> tags into the DOM.
>>
>> require() in it's synchronous form makes sense in the context of node,
>> it does not in the context of the browser.
>>
>> Say you have moduleA, moduleB and moduleC and they all require moduleZ.
>>
>> Using browserify, you have to inject moduleZ into moduleA, moduleB and
>> moduleC. If moduleZ is 30kb of javascript, this is a huge issue.
>>
>> This is just one of the reasons why taking the async approach works
>> better, it does what node does synchronously, a synchronously. require()
>> accepts a string, tries to map that path to a file, includes that file,
>> etc. in the process of doing this, it caches that js file. Thus, calling
>> require("foo") 100 times, does not have the overhead of require("foo") x
>> 100.
>>
>> You can not get require("foo") working in the browser the same way that
>> node implements it. You can however, get an async approach to this problem
>> implemented in node. You need some way for the browser to resolve "foo" to
>> an actual file, load that file, and upon loading that file, invoke a
>> callback function.
>>
>> This is a problem that RequireJS, MinionJS and dojo all handle and this
>> is the right approach the problem.
>>
>> Browserify is a cool project, but it's usefulness ends as soon as you
>> step into real world applications.
>>
>> Taka
>>
>> On Thu, Feb 9, 2012 at 1:35 PM, Phoscur <[email protected]> wrote:
>>
>>> Then do not load code via ajax.
>>>
>>> Am 09.02.2012 22:18, schrieb Mark Hahn:
>>> > > What exactly the problem with using node's synchronous approach in
>>> > the browser?
>>> >
>>> > Node loads the module quickly from the disk. Loading over an ajax
>>> > request is much slower.
>>> >
>>> > --
>>> > Job Board: http://jobs.nodejs.org/
>>> > Posting guidelines:
>>> > https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
>>> > You received this message because you are subscribed to the Google
>>> > Groups "nodejs" group.
>>> > To post to this group, send email to [email protected]
>>> > To unsubscribe from this group, send email to
>>> > [email protected]
>>> > For more options, visit this group at
>>> > http://groups.google.com/group/nodejs?hl=en?hl=en
>>>
>>> --
>>> Job Board: http://jobs.nodejs.org/
>>> Posting guidelines:
>>> https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
>>> You received this message because you are subscribed to the Google
>>> Groups "nodejs" group.
>>> To post to this group, send email to [email protected]
>>> To unsubscribe from this group, send email to
>>> [email protected]
>>> For more options, visit this group at
>>> http://groups.google.com/group/nodejs?hl=en?hl=en
>>>
>>
>> --
>> Job Board: http://jobs.nodejs.org/
>> Posting guidelines:
>> https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
>> You received this message because you are subscribed to the Google
>> Groups "nodejs" group.
>> To post to this group, send email to [email protected]
>> To unsubscribe from this group, send email to
>> [email protected]
>> For more options, visit this group at
>> http://groups.google.com/group/nodejs?hl=en?hl=en
>>
>> --
>> Job Board: http://jobs.nodejs.org/
>> Posting guidelines:
>> https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
>> You received this message because you are subscribed to the Google
>> Groups "nodejs" group.
>> To post to this group, send email to [email protected]
>> To unsubscribe from this group, send email to
>> [email protected]
>> For more options, visit this group at
>> http://groups.google.com/group/nodejs?hl=en?hl=en
>>
>
> --
> Job Board: http://jobs.nodejs.org/
> Posting guidelines:
> https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
> You received this message because you are subscribed to the Google
> Groups "nodejs" group.
> To post to this group, send email to [email protected]
> To unsubscribe from this group, send email to
> [email protected]
> For more options, visit this group at
> http://groups.google.com/group/nodejs?hl=en?hl=en
>
> --
> Job Board: http://jobs.nodejs.org/
> Posting guidelines:
> https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
> You received this message because you are subscribed to the Google
> Groups "nodejs" group.
> To post to this group, send email to [email protected]
> To unsubscribe from this group, send email to
> [email protected]
> For more options, visit this group at
> http://groups.google.com/group/nodejs?hl=en?hl=en
>
--
Better a little with righteousness
than much gain with injustice.
Proverbs 16:8
--
Job Board: http://jobs.nodejs.org/
Posting guidelines:
https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
You received this message because you are subscribed to the Google
Groups "nodejs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/nodejs?hl=en?hl=en