Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do you modularize your Chrome Applications with Browserify?

Tags:

I watched the following Google Apps Office video and learned how you can use browserify to package your JS into one file using the node CommonJS packaging system. I like this idea as it also adds many node libraries ported to the browser and it can handle CoffeeScript.

The one thing the video did not cover was how to make a Chrome App that has more then one view still use browserify in a DRY way. Let me explain. Normally your browserify command takes a series of JS files (designed as modules) and concatenates it into a single JS file with some packaging sugar. This is great of you reference that JS file from say your content page, background page, or popup page. However, if you were to have an app that has both a background page and a popup page would you include the same compiled JS file in each? Would this not cause chrome to load the script twice (in two instances)? If so that seems like a lot of waste interpreting everything only to get the parts you want. Or is the require()/exports modal prevent unnecessary interpretation of modules you may not need for a particular context?

If this is not the best practise how should one package modules in a way that each page gets the needed modules in a dry way without having to repeat yourself or having separate browserify bundles per page? How have others approached this topic?