在前端开发过程中，图片的优化是一个很重要的话题。一些图片优化工具可以使图片更小且质量更好，从而提高页面的加载速度。其中一种使用广泛的工具就是 imagemin-optipng-vendor。
介绍
imagemin-optipng-vendor 是一个 Node.js 库，用于优化 PNG 图片文件。它是基于 optipng 和 optipng-bin 实现的。与其他用于 PNG 压缩的工具比较，它拥有更快的速度和更高的压缩比。
imagemin-optipng-vendor 具有以下特点：
- 支持 Node.js 版本 6+；
- 使用原生代码进行优化，不依赖外部二进制文件；
- 可设置不同的优化级别；
- 支持异步操作。
安装
imagemin-optipng-vendor 可以在 Node.js 环境下直接使用 npm 安装。在终端中输入以下命令即可安装：
--- ------- ----------------------- ----------
在安装时如果出现错误，可能是由于缺少编译环境导致的。这时候需要确保编译环境已经安装成功。
使用
下面是一个简单的使用示例，我们创建一个 test.js 文件并输入以下代码：
----- -------- - --------------------
----- --------------------- - -----------------------------------
------ -- -- -
----- -------------------------- -
------------ ---------------
-------- -
-----------------------
------------------ -
--
-
---
-----------------------
-----这个例子中，我们使用 imagemin 执行图片压缩。通过调用 imageminOptipngVendor() 函数，我们将 imagemin 插件 imagemin-optipng-vendor 加载到 imagemin 中。然后我们可以设置不同的优化级别，这里我们设置为 5。
在命令行终端中执行以下命令，即可运行此脚本：
---- -------
在代码执行完毕后，我们可以在 build/images 文件夹下找到我们压缩后的图片。
深入理解
在上面的示例中，我们使用了一个优化级别为 5 的参数，但是我们该如何确定一个合适的优化级别呢？
优化级别是一个介于 0 到 7 之间的整数，数字越大表示优化级别越高，压缩比也越高，但压缩所需的时间会变得更长。
以下是各个级别的示例：
- 0：无优化，删除所有元数据；
- 1：最小化，删除一些不必要的元数据以及对颜色的重新编码；
- 2：更多最小化，减少颜色深度、颜色的置换处理以及删除 alpha 数据；
- 3：加强优化，应用更多的取样和临近色更换；
- 4-6：应用不同水平的算法优化；
- 7：应用最高级别的算法优化，但是运行时间最长。
如果您的图片大小不是很大，那么使用优化级别为 5 或者 6 的参数即可。如果您的图片比较大，那么可以使用优化级别 7，但是运行时间会比较长。
结论
综上所述，imagemin-optipng-vendor 是一个优秀的 PNG 优化工具，不仅可以帮助我们在前端开发过程中优化图片，而且速度快、压缩比高，是非常值得推荐的 npm 包之一。通过本文的介绍，相信大家对它的使用有了更深刻的理解。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6005709d81e8991b448e7f26