@ -4,61 +4,39 @@ description: Guide to writing modules and optimizing browser bundles.
# Browser Builds
# Browser Builds
When developing a module that will need to work in a browser and does not use the entire Bitcore namespace, it's recommended to narrow the scope of the requires to the particular modules that are needed. It will produce a smaller browser bundle as it will only include the JavaScript that is nessessary. Below is a quick tutorial that will use three modules.
When developing a module that will depend on Bitcore, it's recommended to exclude Bitcore in the distributed browser bundle when using browserify and to use the `--external bitcore` parameter. It will produce a smaller browser bundle, as it will only include the JavaScript that is nessessary, and will depend on the Bitcore browser build which is better for distribution.
## Tutorial
## Tutorial
**Step 1**: Require Bitcore Modules
**Step 1**: Require Bitcore
Here we require specific Bitcore modules that will be used in a `index.js` file:
Here we require Bitcore and define the namespace (`index.js`):
```javascript
```javascript
var PrivateKey = require('bitcore/lib/privatekey');
var bitcore = require('bitcore');
var PublicKey = require('bitcore/lib/publickey');
var PrivateKey = bitcore.PrivateKey;
var Address = require('bitcore/lib/address');
var PublicKey = bitcore.PublicKey;
var Address = bitcore.Address;
// the rest of the module here
```
```
See the [main file](https://github.com/bitpay/bitcore/blob/master/index.js) for bitcore for a complete list, as well as the [Bitcore Documentation](index.md).
**Step 2**: Browserifying
**Step 2**: Browserifying
Next we will generate a browser bundle using [browserify](https://www.npmjs.com/package/browserify) by running the command:
Next we will generate a browser bundle using [browserify](https://www.npmjs.com/package/browserify) by running the command:
This will output a file `index.browser.js` at around 700KB *(the entire Bitcore namespace is around 2MB)*.
This will output a file `module-name.js` with only the code loaded from `index.js` (bitcore.js will need to be loaded beforehand, which is around 145KB gzipped)
**Step 3**: Uglifying
**Step 3**: Uglifying
This can be further optimized by using [uglifyjs](https://www.npmjs.com/package/uglify-js), and running the command:
This can be further optimized by using [uglifyjs](https://www.npmjs.com/package/uglify-js), and running the command: