@jsquash/图片

用 Web Assembly 解码浏览器中的 GIF 图像的简单方法 .

使用 粗口胶囊。 。 。 .

A 类 积分 软件包.

安装

npm install --save @jsquash/gif

使用量

注意 : 您需要手动将代码目录中的被点文件包含在内, 或者使用 WebPack 或 Rollup 这样的捆绑器将它们包含在您的应用程序/ 服务器中 .

decode(data: ArrayBuffer): Promise<ImageData>

解码 GIF 二进制数据至 ImageData。 。 。 .

import { decode } from '@jsquash/gif';

const imageBuffer = await fetch('/example.gif').then((res) => res.arrayBuffer());
const imageData = await decode(imageBuffer);

decodeAnimated(data: ArrayBuffer): Promise<GIFFrame[]>

解码所有 GIF 动画框架 .

import { decodeAnimated } from '@jsquash/gif';

const imageBuffer = await fetch('/animated.gif').then((res) => res.arrayBuffer());
const frames = await decodeAnimated(imageBuffer);

isAnimated(data: ArrayBuffer): Promise<boolean>

检查 GIF 是否包含多个框架 .

import { isAnimated } from '@jsquash/gif';

const imageBuffer = await fetch('/image.gif').then((res) => res.arrayBuffer());
const animated = await isAnimated(imageBuffer);

手工 WASM 初始化( 不推荐)

这个 decode 模块导出 a init 函数,用于手动加载原模块.

import decode, { init as initGifDecode } from '@jsquash/gif/decode';

initGifDecode(WASM_MODULE);
const image = await fetch('./image.gif').then((res) => res.arrayBuffer()).then(decode);