如果你的代码比较多，可能像上图这样一次编译需要1s以上，这是比较慢的。这种时候，推荐使用watchify。它可以在你修改文件后，只重新编译需要的部分（而不是Browserify原本的全部编译），这样，只有第一次编译会花些时间，此后的即时变更刷新则十分迅速。
有关更多Browserify + Gulp的示例，请参考Gulp Recipes。
特性及简要原理
使用Browserify来组织JavaScript，有什么要注意的地方吗？
要回答这个问题，我们先看看Browserify到底做了什么。下面是一个比较详细的例子。
项目内现在用到2个.js文件，它们存在依赖关系，其内容分别是：
name.js
module.exports = "aya";
main.js
var name = require("./name"); console.log("Hello! " + name);
然后对main.js运行Browserify，得到的bundle.js的文件内容是这样的：
bundle.js
(function e(t, n, r) { // ... })({ 1: [function (require, module, exports) { var name = require("./name"); console.log("Hello! " + name); }, {"./name": 2}], 2: [function (require, module, exports) { module.exports = "aya"; }, {}] }, {}, [1]) //# sourceMappingURL=https://www.jb51.net/bundle.js.map
请先忽略掉省略号里的部分。然后，它的结构就清晰多了。可以看到，整体是一个立即执行的函数（IIFE），该函数接收了3个参数。其中第1个参数比较复杂，第2、3个参数在这里分别是{}和[1]。
模块map
第1个参数是一个Object，它的每一个key都是数字，作为模块的id，每一个数字key对应的值是长度为2的数组。可以看出，前面的main.js中的代码，被function(require, module, exports){}这样的结构包装了起来，然后作为了key1数组里的第一个元素。类似的，name.js中的代码，也被包装，对应到key2。
数组的第2个元素，是另一个map对应，它表示的是模块的依赖。main.js在key1，它依赖name.js，所以它的数组的第二个元素是{"./name": 2}。而在key2的name.js，它没有依赖，因此其数组第二个元素是空Object{}。
因此，这第1个复杂的参数，携带了所有模块的源码及其依赖关系，所以叫做模块map。
包装
前面提到，原有的文件中的代码，被包装了起来。为什么要这样包装呢？
因为，浏览器原生环境中，并没有require()。所以，需要用代码去实现它（RequireJS和Sea.js也做了这件事）。这个包装函数提供的3个参数，require、module、exports，正是由Browserify实现了特定功能的3个关键字。
缓存
第2个参数几乎总是空的{}。它如果有的话，也是一个模块map，表示本次编译之前被加载进来的来自于其他地方的内容。现阶段，让我们忽略它吧。
入口模块
第3个参数是一个数组，指定的是作为入口的模块id。前面的例子中，main.js是入口模块，它的id是1，所以这里的数组就是
[1]。数组说明其实还可以有多个入口，比如运行多个测试用例的场景，但相对来说，多入口的情况还是比较少的。
实现功能
还记得前面忽略掉的省略号里的代码吗？这部分代码将解析前面所说的3个参数，然后让一切运行起来。这段代码是一个函数，来自于browser-pack项目的prelude.js。令人意外的是，它并不复杂，而且写有丰富的注释，很推荐你自行阅读。
所以，到底要注意什么？
到这里，你已经看过了Browserify是如何工作的。是时候回到前面的问题了。首先，在每个文件内，不再需要自行包装。
你可能已经很习惯类似下面这样的写法：
;(function(){ // Your code here. }());
但你已经了解到，Browserify的编译会将你的代码封装在局部作用域内，所以，你不再需要自己做这个事情，像这样会更好：
// Your code here.
类似的，如果你想用"use strict";启用严格模式，直接写在外面就可以了，这表示在某个文件的代码范围内启用严格模式。
其次，保持局部变量风格。我们很习惯通过window.jQuery和window.$这样的全局变量来访问jQuery这样的库，但如果使用Browserify，它们都应只作为局部变量：
var $ = require("jquery"); $("#alice").text("Hello!");
这里的$就只存在于这个文件的代码范围内（独立的作用域）。如果你在另一个文件内要使用jQuery，需要按照同样的方式去require()。
然而，新的问题又来了，既然jQuery变成了这种局部变量的形式，那我们熟悉的各种jQuery插件要如何使用呢？
browserify-shim
你一定熟悉这样的jQuery插件使用方式：