gulp源码解析（一）—— Stream详解
作为前端，我们常常会和 Stream 有着频繁的接触。比如使用 gulp 对项目进行构建的时候，我们会使用 gulp.src 接口将匹配到的文件转为 stream（流）的形式，再通过 .pipe() 接口对其进行链式加工处理；
或者比如我们通过 http 模块创建一个 HTTP 服务：
const http = require('http');
http.createServer( (req, res) => {
//...
}).listen(3000);
此处的 req 和 res 也属于 Stream 的消费接口（前者为 Readable Stream，后者为 Writable Stream）。
事实上像上述的 req/res，或者 process.stdout 等接口都属于 Stream 的实例，因此较少存在情况，是需要我们手动引入 Stream 模块的，例如：
//demo1.js 'use strict'; const Readable = require('stream').Readable; const rs = Readable(); const s = 'VaJoy'; const l = s.length; let i = 0; rs._read = ()=>{ if(i == l){ rs.push(' is my name'); return rs.push(null) } rs.push(s[i++]) }; rs.pipe(process.stdout);
如果不太能读懂上述代码，或者对 Stream 的概念感到模糊，那么可以放轻松，因为本文会进一步地对 Stream 进行剖析，并且谈谈直接使用它可能会存在的一些问题（这也是为何 gulp 要使用 through2 的原因）。
另外本文的示例均可在我的 github 仓库（https://github.com/VaJoy/stream/）获取到，读者可以自行下载和调试。
一. Stream的作用
在介绍 Stream（流）之前，我们先来看一个例子 —— 模拟服务器把本地某个文件内容吐给客户端：
//demo2 var http = require('http'); var fs = require('fs'); var server = http.createServer(function (req, res) { fs.readFile(__dirname + '/data.txt', function (err, data) { res.end(data); }); }); server.listen(3000);
这段代码虽然可以正常执行，但存在一个显著的问题 —— 对于每一个客户端的请求，fs.readFile 接口都会把整个文件都缓存到内存中去，然后才开始把数据吐给用户。那么当文件体积很大、请求也较多（且特别当请求来自慢速用户）的时候，服务器需要消耗很大的内存，导致性能低下。
然而这个问题，则正是 stream 发挥所长的地方。如前文提及的，res 是流对象，那我们正好可以将其利用起来：
var server2 = http.createServer(function (req, res) { var stream = fs.createReadStream(__dirname + '/data.txt'); stream.pipe(res); }); server2.listen(4000);
在上方代码段里，fs.createReadStream 创建了 data.txt 的可读流（Readable Stream）。这里需要事先了解的是，流可以简单地分为“可读的（readable）”、“可写的（writable）”，或者“读写均可”三种类型，且所有的流都属于 EventEmitter 的实例。
回到代码，对于创建的可读流，我们通过 .pipe() 接口来监听其 data 和 end 事件，并把 data.txt （的可读流）拆分成一小块一小块的数据（chunks），像流水一样源源不断地吐给客户端，而不再需要等待整个文件都加载到内存后才发送数据。
其中 .pipe 可以视为流的“管道/通道”方法，任何类型的流都会有这个 .pipe 方法去成对处理流的输入与输出。
为了方便理解，我们把上述两种方式（不使用流/使用流）处理为如下的情景（卧槽我好好一个前端为啥要P这么萌的图）：
⑴ 不使用流：
⑵ 使用流：
由此可以得知，使用流（stream）的形式，可以大大提升响应时间，又能有效减轻服务器内存的压力。
二. Stream的分类
在上文我们曾提及到，stream 可以按读写权限来简单地分做三类，不过这里我们再细化下，可以把 stream 归为如下五个类别：
⑴ Readable Streams
⑵ Writable Streams
⑶ Transform Streams
⑷ Duplex Streams
⑸ Classic Streams
其中 Transform Streams 和 Duplex Streams 都属于即可读又可写的流，而最后一个 Classic Streams 是对 Node 古早版本上的 Stream 的一个统称。我们将照例对其进行逐一介绍。
2.1 Readable Streams
即可读流，通过 .pipe 接口可以将其数据传递给一个 writable、transform 或者 duplex流：
readableStream.pipe(dst)
常见的 Readable Streams 包括：
- 客户端上的 HTTP responses
- 服务端上的 HTTP requests
- fs read streams
- zlib streams
- crypto streams
- TCP sockets
- 子进程的 stdout 和 stderr
- process.stdin
例如在前面 demo2 的代码段中，我们就使用了 fs.createReadStream 接口来创建了一个 fs read stream：
var server2 = http.createServer(function (req, res) { var stream = fs.createReadStream(__dirname + '/data.txt'); stream.pipe(res); }); server2.listen(4000);
这里有个有趣的地方 —— 虽然 Readable Streams 称为可读流，但在将其传入一个消耗对象之前，它都是可写的：
var Readable = require('stream').Readable; var rs = new Readable; rs.push('servers '); rs.push('are listening on\n'); rs.push('3000 and 4000\n'); rs.push(null); rs.pipe(process.stdout);
执行结果：
在这段代码中，我们通过 readStream.push(data) 的形式往可读流里注入数据，并以 readStream.push(null) 来结束可读流。
不过这种写法有个弊端 —— 从使用 .push() 将数据注入 readable 流中开始，直到另一个东西（process.stdout）来消耗数据之前，这些数据都会存在缓存中。
这里有个内置接口 ._read() 可以用来处理这个问题，它是从系统底层开始读取数据流时才会不断调用自身，从而减少缓存冗余。
我们可以回过头来看 demo1 的例子：
'use strict'; const Readable = require('stream').Readable; const rs = Readable(); const s = 'VaJoy'; const l = s.length; let i = 0; rs._read = ()=>{ if(i == l){ rs.push(' is my name'); return rs.push(null) } rs.push(s[i++]) }; rs.pipe(process.stdout);
我们是在 ._read 方法中才使用 readStream.push(data) 往可读流里注入数据供下游消耗（也会流经缓存），从而提升流处理的性能。
这里也有个小问题 —— 上一句话所提到的“供下游消耗”，这个下游通常又会以怎样的形式来消耗可读流的呢？
首先，可以使用我们熟悉的 .pipe() 方法将可读流推送给一个消耗对象（writable、transform 或者 duplex流）：
//ext1 const fs = require('fs'); const zlib = require('zlib'); const r = fs.createReadStream('data.txt'); const z = zlib.createGzip(); const w = fs.createWriteStream('data.txt.gz'); r.pipe(z).pipe(w);
其次，也可以通过监听可读流的“data”事件（别忘了文章前面提到的“所有的流都属于 EventEmitter 的实例”）来实现消耗处理 —— 在首次监听其 data 事件后，readStream 便会持续不断地调用 _read()，通过触发 data 事件将数据输出。当数据全部被消耗时，则触发 end 事件。
示例：
//demo3 const Readable = require('stream').Readable; class ToReadable extends Readable { constructor(iterator) { super(); this.iterator = iterator } _read() { const res = this.iterator.next(); if (res.done) { // 迭代结束，顺便结束可读流 this.push(null) } setTimeout(() => { // 将数据添加到流中 this.push(res.value + '\n') }, 0) } } const gen = function *(a){ let count = 5, res = a; while(count--){ res = res*res; yield res } }; const readable = new ToReadable(gen(2)); // 监听`data`事件，一次获取一个数据 readable.on('data', data => process.stdout.write(data)); // 可读流消耗完毕 readable.on('end', () => process.stdout.write('readable stream ends~'));
执行结果为：
这里需要留意的是，在使用 .push() 往可读流里注入数据的代码段，我们使用了 setTimeout 将其包裹起来，这是为了让系统能有足够时间优先处理接收流结束信号的事务。当然你也可以改写为：
if (res.done) { // 直接 return return this.push(null) } this.push(res.value + '\n')
2.2 Writable Streams
Writable（可写）流接口是对写入数据的目标的抽象：
src.pipe(writableStream)
常见的 Writable Streams 包括：
- 客户端的 HTTP requests
- 服务端的 HTTP responses
- fs write streams
- zlib streams
- crypto streams
- TCP sockets
- 子进程的 stdin
- process.stdout 和 process.stderr
可写流有两个重要的方法：
- writableStream.write(chunk[, encoding, callback]) —— 往可写流里写入数据；
- writableStream.end([chunk, encoding, callback]) —— 停止写入数据，结束可写流。在调用 .end() 后，再调用 .write() 方法会产生错误。
上方两方法的 encoding 参数表示编码字符串（chunk为String时才可以用）。
write 方法的 callback 回调参数会在 chunk 被消费后（从缓存中移除后）被触发；end 方法的 callback 回调参数则在 Stream 结束时触发。
另外，如同通过 readable._read() 方法可以处理可读流，我们可以通过 writable._write(chunk, enc, next) 方法在系统底层处理流写入的逻辑中，对数据进行处理。
其中参数 chunk 代表写进来的数据；enc 代表编码的字符串；next(err) 则是一个回调函数，调用它可以告知消费者进行下一轮的数据流写入。
示例：
//demo4 const Writable = require('stream').Writable; const writable = Writable(); writable._write = (chunck, enc, next) => { // 输出打印 process.stdout.write(chunck.toString().toUpperCase()); // 写入完成时，调用`next()`方法通知流传入下一个数据 process.nextTick(next) }; // 所有数据均已写入底层 writable.on('finish', () => process.stdout.write('DONE')); // 将一个数据写入流中 writable.write('a' + '\n'); writable.write('b' + '\n'); writable.write('c' + '\n'); // 再无数据写入流时，需要调用`end`方法 writable.end();
执行如下：
2.3 Duplex Streams
Duplex 是双工的意思，因此很容易猜到 Duplex 流就是既能读又能写的一类流，它继承了 Readable 和 Writable 的接口。
常见的 Duplex Streams 有：
- TCP sockets
- zlib streams
- crypto streams
示例：
//demo5 const Duplex = require('stream').Duplex; const duplex = Duplex(); duplex._read = function () { var date = new Date(); this.push( date.getFullYear().toString() ); this.push(null) }; duplex._write = function (buf, enc, next) { console.log( buf.toString() + '\n' ); next() }; duplex.on('data', data => console.log( data.toString() )); duplex.write('the year is'); duplex.end();
执行结果：
2.4 Transform Streams
Transform Stream 是在继承了 Duplex Streams 的基础上再进行了扩展，它可以把写入的数据和输出的数据，通过 ._transform 接口关联起来。
常见的 Transform Streams 有：
- zlib streams
- crypto streams
示例：
//demo6 const Transform = require('stream').Transform; class SetName extends Transform { constructor(name, option) { super(option || {}); this.name = name || '' } // .write接口写入的数据，处理后直接从 data 事件的回调中可取得 _transform(buf, enc, next) { var res = buf.toString().toUpperCase(); this.push(res + this.name + '\n'); next() } } var transform = new SetName('VaJoy'); transform.on('data', data => process.stdout.write(data)); transform.write('my name is '); transform.write('here is '); transform.end();
执行结果：
其中的 _transform 是 Transform Streams 的内置方法，所有 Transform Streams 都需要使用该接口来接收输入和处理输出，且该方法只能由子类来调用。
_transform 接口格式如下：
transform._transform(chunk, encoding, callback)
第一个参数表示被转换（transformed）的数据块（chunk），除非构造方法 option 参数（可选）传入了 “decodeString : false”，否则其类型均为 Buffer；
第二个参数用于设置编码，但只有当 chunck 为 String 格式（即构造方法传入 “decodeString : false”参数）的时候才可配置，否则默认为“buffer”；
第三个参数 callback 用于在 chunk 被处理后调用，通知系统进入下一轮 _transform 调用。该回调方法接收两个可选参数 —— callback([error, data])，其中的 data 参数可以将 chunck 写入缓存中（供更后面的消费者去消费）：
transform.prototype._transform = function(data, encoding, callback){ this.push(data); callback() }; ///////等价于 transform.prototype._transform = function(data, encoding, callback){ callback(null, data) };
另外 Transform Streams 还有一个 _flush(callback) 内置方法，它会在没有更多可消耗的数据时、在“end”事件之前被触发，而且会清空缓存数据并结束 Stream。
该内置方法同样只允许由子类来调用，而且执行后，不能再调用 .push 方法。
关于 Transform Streams 的更多细节还可以参考这篇文章，推荐阅读。
2.5 Classic Streams
在较早版本的 NodeJS 里，Stream 的实现相较简陋，例如上文提及的“Stream.Readable”接口均是从 Node 0.9.4 开始才有，因此我们往往需要对其进行多次封装扩展才能更好地用来开发。
而 Classic Streams 便是对这种古旧模式的 Stream 接口的统称。
需要留意的是，只要往任意一个 stream 注册一个“data”事件监听器，它就会自动切换到“classic”模式，并按照旧的 API 去执行。
classic 流可以当作一个带有 .pipe 接口的事件发射器（event emitter），当它要为消耗者提供数据时会发射“data”事件，当要结束生产数据时，则发射“end”事件。
另外只有当设置 Stream.readable 为 true 时，.pipe 接口才会将当前流视作可读流：
//demo7 var Stream = require('stream'); var stream = new Stream(); stream.readable = true; //告诉 .pipe 这是个可读流 var c = 64; var iv = setInterval(function () { if (++c >= 75) { clearInterval(iv); stream.emit('end'); } else stream.emit('data', String.fromCharCode(c)); }, 100); stream.pipe(process.stdout);
另外，Classic readable streams 还有 .pause() 和 .resume() 两个接口可用于暂停/恢复流的读取：
createServer(function(q,s) { // ADVISORY only! q.pause() session(q, function(ses) { q.on('data', handler) q.resume() }) })
3. Object Mode
对于可读流来说，push(data) 时，data 的类型只能是 String 或Buffer，且消耗时 data 事件输出的数据类型都为 Buffer；
对于可写流来说，write(data) 时，data 的类型也只能是 String 或 Buffer，_write(data) 调用时所传进来的 data 类型都为 Buffer。
示例：
//demo8 writable._write = (chunck, enc, next) => { // 输出打印 console.log(chunck); //Buffer //console.log(chunck.toString()); //转为String process.nextTick(next) }; writable.write('Happy Chinese Year'); writable.end();
执行结果：
不过，为了增强数据类型的灵活性，无论是可读流或是可写流，只需要往其构造函数里传入配置参数“{ objectMode: true }”，便可往流里传入/获取任意类型（null除外）的数据：
const objectModeWritable = Writable({ objectMode: true });
objectModeWritable._write = (chunck, enc, next) => {
// 输出打印
console.log(typeof chunck);
console.log(chunck);
process.nextTick(next)
};
objectModeWritable.write('Happy Chinese Year');
objectModeWritable.write( { year : 2017 } );
objectModeWritable.end( 2017 );
执行结果：
4. Stream的兼容问题
在前文我们介绍了 classic streams，它属于陈旧版本的 Node 上的 Stream 接口，可以把它称为 Streams1。而从 Node 0.10 开始，Stream 新增了系列实用的新接口，可以做更多除了 .pipe() 之外的事情，我们把其归类为 Streams2（事实上，在 Node 0.11+开始，Stream有些许新的变动，从该版本开始的 Stream 也可称为 Streams3）。
那么这里存在一个问题 —— 那些使用了 Stream1 的项目（特别是 npm 包），想升级使用环境的 Node 版本到 0.10+，会否导致兼容问题呢？
还好 Streams2 虽然改头换面，但本质上是设计为向后兼容的。
打个比方，如果你同时推送了一条 Streams2 流和一条旧格式的、基于事件发射器的流，Stream2 将降级为旧模式（shim mode）来向后兼容。
但是，如果我们的开发环境使用的是 Node 0.8（且因为某些原因不能升级），但又想使用 Streams2 的API怎么办呢？或者比如 npm 上的某些开源的工具包，想要拥抱 Streams2 的便利，又想保持对使用 Node 0.8 的用户进行兼容处理，这样又得怎么处理？
针对上述问题，早在 Node 0.10 释放之前，Issacs 就把 Node-core 中操作 Stream 的核心接口独立拷贝了一份出来，开源到了 npm 上并持续更新，它就是 readable-stream。
通过使用 readable-stream，我们就可以在那些核心里没有 Streams2/3 的低版本 Node 中，直接使用 Streams2/3：
var Readable = require('stream').Readable || require('readable-stream').Readable
readable-stream 现在有 v1.0.x 和 v1.1.x 两个主要版本，前者跟进 Streams2 的迭代，后者跟进 Streams3 的迭代，用户可以根据需求使用对应版本的包。
5. through2
readable-stream 虽然提供了一个 Streams 的兼容方案，但我们也希望能对 Stream 复杂的API进行精简。
而 through2 便基于 readable-stream 对 Stream 接口进行了封装，并提供了更简单和灵活的方法。
through2 会为你生成 Transform Streams（貌似旧版本是 Duplex Streams）来处理任意你想使用的流 —— 如前文介绍，相比其它流，Transform 流处理起数据会更加灵活方便。
来看下 through2 的示例：
//demo9 const fs = require('fs'); const through2 = require('through2'); fs.createReadStream('data.txt') .pipe(through2(function (chunk, enc, callback) { for (var i = 0; i < chunk.length; i++) if (chunk[i] == 97) chunk[i] = 122; // 把 'a' 替换为 'z' this.push(chunk); callback() })) .pipe(fs.createWriteStream('out.txt')) .on('finish', ()=> { console.log('DONE') });
使用 through2.obj 接口操作 Object Mode 下的流：
//demo10 const fs = require('fs'); const through2 = require('through2'); const csv2 = require('csv2'); let all = []; fs.createReadStream('list.csv') .pipe(csv2()) // through2.obj(fn) 是 through2({ objectMode: true }, fn) 的简易封装 .pipe(through2.obj(function (chunk, enc, callback) { var data = { name: chunk[0], sex: chunk[1], addr: chunk[2] }; this.push(data); callback() })) .on('data', function (data) { all.push(data) }) .on('end', function () { console.log(all) });
对比原生的 Stream API，through2 简洁了不少，加上有 readable-stream 依赖加持，也很好理解为何像 gulp 及其插件都会使用 through2 来操作和处理 stream 了。
顺便贴下对 through2 的源码注释：
var Transform = require('readable-stream/transform'), inherits = require('util').inherits, xtend = require('xtend'); //构造方法，继承了Transform function DestroyableTransform(opts) { Transform.call(this, opts); this._destroyed = false } inherits(DestroyableTransform, Transform); //原型接口 destroy，用于关闭当前流 DestroyableTransform.prototype.destroy = function (err) { if (this._destroyed) return; this._destroyed = true; var self = this; process.nextTick(function () { if (err) self.emit('error', err); self.emit('close') }) }; // a noop _transform function function noop(chunk, enc, callback) { callback(null, chunk) } // 闭包，用于返回对外接口方法 function through2(construct) { //最终返回此匿名函数 return function (options, transform, flush) { if (typeof options == 'function') { flush = transform transform = options options = {} } if (typeof transform != 'function') transform = noop if (typeof flush != 'function') flush = null return construct(options, transform, flush) } } // 出口，执行 throuh2 闭包函数，返回一个 DestroyableTransform 的实例（t2） module.exports = through2(function (options, transform, flush) { //t2 为 Transform Stream 对象 var t2 = new DestroyableTransform(options); //Transform Streams 的内置接口 _transform(chunk, encoding, next) 方法 t2._transform = transform; if (flush) t2._flush = flush; return t2 }); // 对外暴露一个可以直接 new （或者不加 new）来创建实例的的构造函数 module.exports.ctor = through2(function (options, transform, flush) { function Through2(override) { if (!(this instanceof Through2)) return new Through2(override) this.options = xtend(options, override) DestroyableTransform.call(this, this.options) } inherits(Through2, DestroyableTransform) Through2.prototype._transform = transform if (flush) Through2.prototype._flush = flush return Through2 }) //Object Mode接口的简易封装 module.exports.obj = through2(function (options, transform, flush) { var t2 = new DestroyableTransform(xtend({objectMode: true, highWaterMark: 16}, options)) t2._transform = transform if (flush) t2._flush = flush return t2 })
以上是本文对 Stream 的一个介绍，但事实上 Stream 还有许多未露面的 API，感兴趣的同学可以直接阅读官方 API文档做进一步了解。
本篇文章是对后续 gulp 源码解析系列的一个基础铺垫，想了解更多 gulp 相关内容的话可以留意我的博客。最后恭祝大家鸡年大吉！共勉~
Reference
⑴ Stream API Doc - https://nodejs.org/api/stream.html
⑵ stream-handbook - https://github.com/substack/stream-handbook
⑶ Node.js Stream - 基础篇 - http://www.cnblogs.com/zapple/p/5759670.html
⑷ Why I don't use Node's core 'stream' module - https://r.va.gg/2014/06/why-i-dont-use-nodes-core-stream-module.html
