利用pako更快地传输文件

1. 介绍

1.1. pako介绍

pako是一个javascript编码的zlib高速压缩库,支持浏览器和nodejs.
你可以使用npm

npm install pako  

或者bower来进行安装

bower install pako  

1.2. pako-demo

pako-demo使用pako来在浏览器端进行文件压缩,并在服务端解压存储文件,用以节省网络传输流量.

2. 实现说明

2.1. 浏览器端

pako提供浏览器库帮助在浏览器中对文件进行压缩/解压,compressFile步骤如下:

  1. 使用readAsDataURL获取文件base64数据并压缩.
  2. 发送压缩后数据及文件名到服务端
  3. 接收发送结果

还可以通过FileReader其他接口实现

2.2. 服务端

pako提供服务端库来帮助服务端对文件进行压缩/解压.file请求步骤如下:

  1. 获取文件名及文件流
  2. 解压文件流并转义base64数据到文件中
  3. 完成后返回成功

3. 注意

pako并不是万能的压缩工具,它对于某些特定文件(图片,视频,pdf等)均没有很好的压缩效率.如How to Make Uploading 10x Faster一文中所述:

We Can’t Compress Everything

OK, we can but sometimes it just doesn’t make sense. For example, you won’t make images or videos any smaller with gzip (at least most of them — standard formats like jpg or mpeg are already well compressed).

Text data, on the other side, compresses really well. Depending on a file, we may actually expect up to 90% compression ratio. And it’s not only plain text that can be packed that well. In our case it was 3D related files (obj, stl, etc). Maybe you’ve got some Excel spreadsheets or huge Photoshop files waiting to be uploaded? Go ahead, and try to compress them first. You might be surprised by how much space this can save you.

同时,我们需要注意压缩时间的影响:

But Compression is Slow

And so is uploading files. Remember how we’ve talked about asymmetric networks? With upload speeds that slow, there should be a point where compression time is considerably shorter than uploading. And it’s not really hard to reach this point. For most well-compressable files, you’re already there. Compressing and uploading smaller file will be faster than uploading uncompressed, bigger data.

But to make sure we don’t spend too long compressing, we will use the lowest compression level (1 out of 9). It’s the fastest one but still reduces file size significantly. In most cases you won’t gain much with higher levels.

当然,多了pako后我们多了更多的选择.

4. 参考