budo icon indicating copy to clipboard operation
budo copied to clipboard

[feature] Multiple Bundles

Open mattdesl opened this issue 10 years ago • 5 comments

Maybe there is an easier way to facilitate multiple demos in a single project with budo.

Say your project has two demos: "simple" and "advanced." You would need a script for each one:

"scripts": {
   "simple": "budo src/simple.js --dir static -- -t babelify | garnish",
   "advanced": "budo src/advanced.js --dir static -- -t babelify | garnish"
}

For publishing, you may (or may not) choose to use factor-bundle to reduce duplicate bytes being sent to the user as they navigate through the different demos.

Or imagine a project like ThreeJS, which has dozens of demos that all run using a common codebase. Something like this would be ideal:

npm run demo simple
npm run demo advanced

# builds all demos for static gh-pages
npm run build

In the past, I've used some (unix) shell scripts to reduce a bit of duplication in my package.json: https://github.com/mattdesl/webgl-lines

It's tricky since you can't really pass arguments to a npm run script in the way we need (i.e. before any -- browserify options, garnish, etc). There are some tricks like this but I'm not sure it's a great solution.

Maybe there is a way to tie this in with #60 and #92.

mattdesl avatar Oct 15 '15 15:10 mattdesl

Different but interesting approach: https://github.com/spencer-leopold/mundler

cvan avatar Dec 03 '15 09:12 cvan

You can do:

"scripts": {
   "demo": "budo src/$1 --dir static -- -t babelify | garnish"
}

And then

$ npm run demo -- simple 
$ npm run demo -- advanced

yoshuawuyts avatar Dec 03 '15 12:12 yoshuawuyts

And an extended version that has a default:

"scripts": {
   "demo": "[ $1 ] && s=$1 || s=simple; budo src/$s --dir static -- -t babelify | garnish"
}

yoshuawuyts avatar Dec 03 '15 12:12 yoshuawuyts

In addition to a project with multiple demo apps, there is the following scenario that requires multiple bundles:

The developer is making a large application with many different sections, and wants to have one bundle for the entry-point and multiple bundles for the multiple sections, to be lazy-loaded when they are needed.

mattbrunetti avatar Feb 27 '17 14:02 mattbrunetti

What about the case for webworkers? I just switch back to beefy in these cases. I find multiple bundles nicer that using webworkify inside the code.

hville avatar Feb 28 '17 00:02 hville