实现一个压缩图片功能

现在在线图片压缩的网站很多，我比较推荐熊猫压缩，于是参考熊猫压缩的样式自己也写了一个压缩图片的功能，效果：

有兴趣的可以试试：

http://wzdingzhi.top/system/compressimg

核心是通过创建canvas，调用canvas的toDataURL和toBlob实现压缩，可以从 0 到 1 的区间内选择图片的质量，并不是实现大小的百分比压缩，是根据质量，具体怎么算我就不知道了。这两个api可以去MDN看一下。本来想贴一些代码，想想还是直接看gitHub吧：

https://github.com/wade3po/system/blob/master/src/views/plugin/CompressImg.vue

这边说一下，本来toDataURL和toBlob是都可以实现压缩，一个直接转成blob，一个转成base64，转成base64的还要再转成blob实现下载，我也去找了一些文章，说是toBlob性能更好，但是实际上却出问题了，因为我没有限制图片大小和数量，图片稍微多一些，浏览器直接内存溢出崩了。而用toDataURL反而更快更稳定。代码里面两个方法都写了，有兴趣可以分别试试这两个方法。

最后就是下载，提供了单独下载和批量下载，单独下载就不说了，就是之前分享的学学文件对象里面就有模拟a链接点击下载，批量下载这边是用了jszip和file-saver，使用也挺简单的，jszip依赖file-saver，jszip的npm上的文档也没说，按道理既然依赖应该要内部实现依赖，我用的时候要自己安装和引用，不过也不确定，没有特地去实验就是了。