# 谷歌免费开源图片压缩插件

谷歌免费开源图片压缩插件

# 关于 Squoosh

该插件作者并未使用过,请自行排除错误

github仓库 (opens new window)

Squoosh 是谷歌出品的一款在线图像 (opens new window)压缩工具,使用简单,有极高的压缩比,能够帮助我们把图片大小进行压缩,不管是设计 UI 切图、自媒体文章配图还是 PPT 配图这样的使用场景,都要用到压缩图片。

# Squoosh 的功能特性

  • 压缩率很高,在保存图片清晰度的同时大幅降低文件大小
  • 使用简单,打开浏览器就,拖入或选择图片就能使用
  • 支持生成 JPG / PNG (opens new window) / WEBP 等多种常用图片格式
  • 支持高级的压缩功能,比如旋转、裁剪、调色、平滑等
  • 支持开发者集成在自己的项目中,通过简单的 api (opens new window) 来实现图片压缩
  • 利用浏览器自身的算力来完成压缩,不会上传图片,速度快,也很安全

# 开发集成图片压缩功能

谷歌开发并且开源这款工具的初衷,是希望更多开发者使用它来降低图片的大小的同时还保证了图片质量,使用户获得更快的上网体验。

目前 Squoosh 提供 CLI 命令行和 api 的开发方式,使用 api 开发者可以很方便地集成到自己的项目中。下面是 api 方式开发集成的方法:

# 安装 Squoosh

npm install @squoosh/lib
1

# 在开发项目中引入和初始化

这将创建一个具有底层处理管道的图像池,您可以使用该处理管道接收和编码图像。ImagePool构造函数接受一个参数,该参数定义在任何给定时间允许运行的并行操作数。 ⚠️ 重要的确保在执行并行图像处理时仅创建1个ImagePool。如果创建多个池,ImagePool可能会耗尽内存并崩溃。通过重用单个ImagePool,您可以确保备份工作队列和处理管道在处理下一个图像之前释放内存。

import { ImagePool } from '@squoosh/lib';
import { cpus } from 'os';
const imagePool = new ImagePool(cpus().length);
1
2
3

# 压缩图片

import fs from 'fs/promises';
const file = await fs.readFile('./path/to/image.png');
const image = imagePool.ingestImage(file);

const preprocessOptions = {
   // 压缩参数:比如缩放图片
   resize: {
      width: 100,
      height: 50,
   }
};
await image.preprocess(preprocessOptions);
const encodeOptions = {
   mozjpeg: {}, // 默认压缩输出为jpeg格式
   jxl: {
      quality: 90, // 设置压缩质量
   },
};
const result = await image.encode(encodeOptions);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19