# @documenso/skia-canvas 中文文档

规范地址：https://npmcn.com/package/%40documenso/skia-canvas/

版本：3\.0\.8-documenso\.3
npm 元数据更新时间：2026-08-13T11:17:16.461Z
中文译文更新时间：2026-11-12T14:17:45.235Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40documenso/skia-canvas
原文对照：https://npmcn.com/package/%40documenso/skia-canvas/?lang=original
项目主页：https://skia-canvas.org/
源码仓库：https://github.com/documenso/skia-canvas

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：179 kB，19 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：4 个
- 首次发布：2026-08-13T06:26:32.026Z
- 最新版本发布：2026-08-13T11:17:16.286Z
- 近 30 天下载量：19557（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：2（近 12 个月 2 个）

## 中文简介

多线程的 GPU 加速 Canvas API 用于节点

## 安装

```sh
npm install @documenso/skia-canvas
```

也可以使用：`pnpm add @documenso/skia-canvas`、`yarn add @documenso/skia-canvas`、`bun add @documenso/skia-canvas`

## README

[![Skia Canvas](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/hero@2x.png)](https://skia-canvas.org/)

* * *

[开始](http://skia-canvas.org/getting-started)   • 妇女   [文档](http://skia-canvas.org/api)   • 妇女   [发布注释](http://skia-canvas.org/releases)   • 妇女   [讨论论坛](https://github.com/samizdatco/skia-canvas/discussions)

### [3.0版本现已可用](https://github.com/samizdatco/skia-canvas/discussions/255)

* * *

Skia Canvas 是 HTML Canvas 绘图的节点.js 执行 [API 密码](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) 用于屏幕和屏幕外渲染。 因为它使用谷歌 [斯基亚](https://skia.org/) 图形引擎,其输出与Chrome非常相似 [`<canvas>`](https://html.spec.whatwg.org/multipage/canvas.html) 元素——虽然它也能够实现浏览器的Canva仍然无法实现的东西.

特别是Skia Canvas:

-   以向量( PDF & SVG) 和位图( JPEG, PNG, & WEBP) 格式生成图像
-   能够绘制到交互式图形界面 [窗口](https://skia-canvas.org/api/window) 并提供了类似浏览器的 [事件](https://skia-canvas.org/api/window#on--off--once) 框架
-   可以将图像保存到 [文件](https://skia-canvas.org/api/canvas#tofile)编码为 [数据URL](https://skia-canvas.org/api/canvas#tourl) 字符串,然后返回 [缓冲](https://skia-canvas.org/api/canvas#tobuffer) 或者说 [锐利](https://sharp.pixelplumbing.com/) 对象
-   在 a 中使用本地线程 [用户配置](https://skia-canvas.org/getting-started#multithreading) 同步渲染和文件 I/ 欧
-   能够创建 [多页](https://skia-canvas.org/api/canvas#newpage) 在给定的画布上,然后 [产出](https://skia-canvas.org/api/canvas#tofile) 它们作为单页多页 PDF 或图像序列保存到多个文件
-   能够 [简化](https://skia-canvas.org/api/path2d#simplify), (中文(简体) ), [钝子](https://skia-canvas.org/api/path2d#round), (中文(简体) ), [组合](https://skia-canvas.org/api/path2d#complement-difference-intersect-union-and-xor), (中文(简体) ), [节选](https://skia-canvas.org/api/path2d#trim),以及 [原子化](https://skia-canvas.org/api/path2d#points) 使用贝塞尔路径 [高效](https://www.youtube.com/watch?v=OmfliNQsk88) 布尔操作或点数 [插值](https://skia-canvas.org/api/path2d#interpolate)
-   提供 [三维视角](https://skia-canvas.org/api/context#createprojection) 转换之外 [缩放](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/scale), (中文(简体) ), [旋转](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/rotate),以及 [翻译](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/translate)
-   可以以向量填充形状 [纹理](https://skia-canvas.org/api/context#createtexture) 除以位图为基础的 [模式](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/createPattern) 并使用自定义支持行绘制 [标记](https://skia-canvas.org/api/context#linedashmarker)
-   支持完整的一组 [CSS 过滤器](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/filter) 图像处理操作员
-   提供丰富的打印控制,包括:
    -   多线, [已文字包装](https://skia-canvas.org/api/context#textwrap) 文本
    -   逐行 [文本参数](https://skia-canvas.org/api/context#measuretext)
    -   使用标准可访问的小盖、带状和其他开口类型特性 [字体变量](https://skia-canvas.org/api/context#fontvariant) 语法
    -   比例 [字母间距](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/letterSpacing), (中文(简体) ), [文字间距](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/wordSpacing),以及 [领导](https://skia-canvas.org/api/context#font)
    -   支持 [变量字体](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide) 以透明方式绘制重量值图
    -   使用非系统字体 [已装入](https://skia-canvas.org/api/font-library#use) 从本地文件
-   可用于在标准 Linux 主机和Vercel 和 AWS Lambda 等 " 无服务器 " 平台上的服务器侧图像渲染

## 安装

如果您运行在一个支持的平台上,安装应该像:

```bash
npm install skia-canvas
```

这将下载项目最新版本的预编译库 [释放](https://github.com/samizdatco/skia-canvas/releases)。 。 。 .

### `pnpm`

如果你使用 `pnpm` 软件包管理器, 它不会下载 `skia-canvas`平台 - 本地二进制, 除非你明确允许 。 您可以通过“ 核准构建” 命令进行交互操作( 注意需要按 `<space>` 切换选择,然后 `<enter>` 继续:

```bash
pnpm install skia-canvas
pnpm approve-builds
```

在非交互情况下(如通过CI构建),您可以在添加时批准构建步骤 `skia-canvas` 对您的项目:

```bash
pnpm install skia-canvas --allow-build=skia-canvas
```

或者,您可以添加一个 [`pnpm.onlyBuiltDependencies`](https://pnpm.io/9.x/package_json#pnpmonlybuiltdependencies) 条目 `package.json` 用于标记构建步骤的文件 :

```json
{
  "pnpm": {
    "onlyBuiltDependencies": ["skia-canvas"]
  }
}
```

## 平台支持

Skia Canvas运行于Linux,macOS,或Windows以及Vercel和AWS Lambda等无服务器平台上. 预编版的图书馆本土代码将在适当的架构中自动下载(`arm64` 或者说 `x64`当您通过 npm 安装它.

Rust 图书馆的基本用途 [N - API (英语)](https://nodejs.org/api/n-api.html#node-api-version-matrix) v8 允许它全部运行 [当前支持](https://nodejs.org/en/about/previous-releases) 节点.js发布后,它与可回V12.22+,v14.17+,v15.12+,和v16+的版本相后相兼容.

### 链接

库与 Linux 系统兼容 [glibc 图像](https://www.gnu.org/software/libc/) 2.28 或以后的阿尔卑斯-利努斯和 [马斯尔](https://musl.libc.org/) 喜欢的C图书馆 它将利用该系统 `fontconfig` 设置在 `/etc/fonts` 如果它们存在,否则将倒退到使用 [占位符配置](https://github.com/samizdatco/skia-canvas/blob/main/lib/fonts/fonts.conf),在常用的 Linux 路径中寻找已安装的字体.

### 夹克

如果你正在设置一个 [粘贴文件](https://nodejs.org/en/docs/guides/nodejs-docker-webapp/) 用于 [`node`](https://hub.docker.com/_/node) 作为它的基础,最简单的方法是确定你的 `FROM` 图像到( Debian- 衍生) 默认之一 `node:lts`, (中文(简体) ), `node:22`, (中文(简体) ), `node:24-bookworm`,或者简单地:

```dockerfile
FROM node
```

如果你想使用阿尔卑斯山作为基础分布,可以从以下几个方面开始:

```dockerfile
FROM node:alpine
```

### AWS 兰布达

Skia Canvas 依赖于标准 Lambda 中没有的图书馆 [运行时间](https://docs.aws.amazon.com/lambda/latest/dg/lambda-runtimes.html)。您可以通过上传一个“[层](https://docs.aws.amazon.com/lambda/latest/dg/chapter-layers.html)' (包含所需库和 `node_modules` 目录)和配置您的功能以使用它.

**详细 AWS 指令**

#### 将 Skia Canvas 层添加到您的 AWS 账户

1.  看那边 **资产** skia Canvas的章节 [当前发布](https://github.com/samizdatco/skia-canvas/releases/latest) 并下载 `aws-lambda-x64.zip` 或者说 `aws-lambda-arm64.zip` 文件( 取决于您的架构) 但不要解压缩
2.  去AWS蓝巴达 [层控制台](https://console.aws.amazon.com/lambda/home/#/layers) 并单击 **创建图层** 按钮,然后填入字段:

-   **名称**数字 : `skia-canvas` (或随想
-   **说明**: 您也许需要注意这里的 Skia Canvas 版本
-   **兼容结构**选择 **x86 64 (韩语)** 或者说 **军火64** 根据你选择的拉链
-   **兼容的运行时间**选择 **节点.js 22.x** (和(或)20.x)

3.  点击 **选择文件** 按钮,然后单击 **创建**

或者,你可以使用 [`aws` 命令行工具](https://github.com/aws/aws-cli) 来创建层。 这部闪闪发光的脚本将获取您所选择的 skia-canvas 版本,并提供给您的 Lambda 功能 .

```sh
#!/usr/bin/env bash
VERSION=3.0.8 # the skia-canvas version to include
PLATFORM=arm64 # arm64 or x64

curl -sLO https://github.com/samizdatco/skia-canvas/releases/download/v${VERSION}/aws-lambda-${PLATFORM}.zip
aws lambda publish-layer-version \
    --layer-name "skia-canvas" \
    --description "Skia Canvas ${VERSION} layer" \
    --zip-file "fileb://aws-lambda-${PLATFORM}.zip" \
    --compatible-runtimes "nodejs20.x" "nodejs22.x" \
    --compatible-architectures "${X/#x/x86_}"
```

#### 在 Lambda 函数中使用层

您现在可以在您创建的任何函数中使用此层 [函数控制台](https://console.aws.amazon.com/lambda/home/#/functions),单击 **添加图层** 按钮后,您可以选择新建的 Skia Canvas 层 **自定义图层** 层源.

请注意, 层只包含 Skia Canvas 及其依赖性 —— 您想要使用的任何其他 npm 模块都需要被捆绑到您的函数中 。 防止 `skia-canvas` 模块,请确保您添加到 `devDependencies` 节次(**没有** 经常预算 `dependencies` 您的软件包。 json 文件.

### 下个.js / Webpack 软件包

如果您使用像Next.js这样的框架,将您的服务器侧代码与Webpack捆绑在一起,则需要标记 `skia-canvas` 作为"外部",否则其平台本土二进制文件将被排除在最终构建之外. 尝试将这些选项添加到您的 `next.config.ts` 文件 :

```js
const nextConfig: NextConfig = {
  serverExternalPackages: ['skia-canvas'],
  webpack: (config, options) => {
    if (options.isServer){
      config.externals = [
        ...config.externals,
        {'skia-canvas': 'commonjs skia-canvas'},
      ]
    }
    return config
  }
};
```

## 从来源汇编

如果您的系统无法使用预建的二进制, 您需要编译此库中直接与 Skia 接口的部分 .

安装开始 :

1.  最新版本 `git` (旧版本对斯基亚的子模块有困难)
2.  这个 [Rust 编译器](https://www.rust-lang.org/tools/install) 和货物包管理器 [`rustup`](https://rust-lang.github.io/rustup/)
3.  C 编译工具链( LLVM/ Clang 或 MSVC)
4.  Python 3 (由 Skia 使用) [构建进程](https://skia.org/docs/user/build/)(中文(简体) )
5.  这个 [忍者会](https://ninja-build.org/) 构建系统
6.  在 Linux 上: 字体配置和 OpenSSL

[详细说明](https://github.com/rust-skia/rust-skia#building) 在Rust Skia文档的 " 建筑 " 部分可以找到用于建立对不同操作系统的依赖。 内有多克文件 [集装箱](https://github.com/samizdatco/skia-canvas/tree/main/containers) 名录也可能有助于确定所需的依赖性。 一旦所有必要的编译器和图书馆都到齐,即可运行 `npm run build` 这将为您提供一个有用的库(经过相当长的编译过程).

## 全局设置

> 有一些设置只能在启动时配置,并将应用于您在脚本中创建的所有画布. 以下各节介绍不同的情况: [环境变量](https://nodejs.org/en/learn/command-line/how-to-read-environment-variables-from-nodejs) 您可以设定进行全球变化。 你可以把它们设定为命令行引用的一部分,或者放在一个 `.env` 在您的工程目录中的文件并使用节点 20's [`--env-file` 参数](https://nodejs.org/dist/latest-v22.x/docs/api/cli.html#--env-fileconfig) 把它们全部装上.

### 多脚踏车

在背景中渲染画布时( 例如, 使用同步) [移动](https://skia-canvas.org/api/canvas#tofile) 或者说 [缓冲](https://skia-canvas.org/api/canvas#tobuffer) 将任务产入由 [线条](https://crates.io/crates/rayon) 图书馆。 默认它会创造出与你的CPU一样多的线程. 您可以通过检查任何默认值来查看此值 [帆布](https://skia-canvas.org/api/canvas) 对象的 [`engine.threads`](https://skia-canvas.org/api/canvas#engine) 属性。 如果您想要推翻此默认, 您可以设置 `SKIA_CANVAS_THREADS` 环境变量与您的首选值.

例如,您可以通过运行脚本将同步处理限制在两个同时进行的任务:

```bash
SKIA_CANVAS_THREADS=2 node my-canvas-script.js
```

### 参数验证

有些情况下浏览器API会通过默默地忽略方法调用而不是出错来回应无效的参数. 例如,这些线条根本就没有效果:

```js
ctx.fillRect(0, 0, 100, "october")
ctx.lineTo(NaN, 0)
```

Skia Canvas尽了最大努力去模仿这些怪事,但允许您选择更严格的模式,在这种情况下它会扔出TypeErrors(这可用于调试).

设定 `SKIA_CANVAS_STRICT` 环境变量改为 `1` 或者说 `true` 以启用此模式.

## 示例使用

### 生成图像文件

```js
import {Canvas} from 'skia-canvas'

let canvas = new Canvas(400, 400),
    ctx = canvas.getContext("2d"),
    {width, height} = canvas;

let sweep = ctx.createConicGradient(Math.PI * 1.2, width/2, height/2)
sweep.addColorStop(0, "red")
sweep.addColorStop(0.25, "orange")
sweep.addColorStop(0.5, "yellow")
sweep.addColorStop(0.75, "green")
sweep.addColorStop(1, "red")
ctx.strokeStyle = sweep
ctx.lineWidth = 100
ctx.strokeRect(100,100, 200,200)

// render to multiple destinations using a background thread
async function render(){
  // save a ‘retina’ image...
  await canvas.saveAs("rainbox.png", {density:2})
  // ...or use a shorthand for canvas.toBuffer("png")
  let pngData = await canvas.png
  // ...or embed it in a string
  let pngEmbed = `<img src="${await canvas.toDataURL("png")}">`
}
render()

// ...or save the file synchronously from the main thread
canvas.saveAsSync("rainbox.pdf")
```

### 多页序列

```js
import {Canvas} from 'skia-canvas'

let canvas = new Canvas(400, 400),
    ctx = canvas.getContext("2d"),
    {width, height} = canvas

for (const color of ['orange', 'yellow', 'green', 'skyblue', 'purple']){
  ctx = canvas.newPage()
  ctx.fillStyle = color
  ctx.fillRect(0,0, width, height)
  ctx.fillStyle = 'white'
  ctx.arc(width/2, height/2, 40, 0, 2 * Math.PI)
  ctx.fill()
}

async function render(){
  // save to a multi-page PDF file
  await canvas.saveAs("all-pages.pdf")

  // save to files named `page-01.png`, `page-02.png`, etc.
  await canvas.saveAs("page-{2}.png")
}
render()
```

### 向窗口渲染

```js
import {Window} from 'skia-canvas'

let win = new Window(300, 300)
win.title = "Canvas Window"
win.on("draw", e => {
  let ctx = e.target.canvas.getContext("2d")
  ctx.lineWidth = 25 + 25 * Math.cos(e.frame / 10)
  ctx.beginPath()
  ctx.arc(150, 150, 50, 0, 2 * Math.PI)
  ctx.stroke()

  ctx.beginPath()
  ctx.arc(150, 150, 10, 0, 2 * Math.PI)
  ctx.stroke()
  ctx.fill()
})
```

### 与 [锐利.js](https://sharp.pixelplumbing.com/)

```js
import sharp from 'sharp'
import {Canvas, loadImage} from 'skia-canvas'

let canvas = new Canvas(400, 400),
    ctx = canvas.getContext("2d"),
    {width, height} = canvas,
    [x, y] = [width/2, height/2]

ctx.fillStyle = 'red'
ctx.fillRect(0, 0, x, y)
ctx.fillStyle = 'orange'
ctx.fillRect(x, y, x, y)

// Render the canvas to a Sharp object on a background thread then desaturate
await canvas.toSharp().modulate({saturation:.25}).jpeg().toFile("faded.jpg")

// Convert an ImageData to a Sharp object and save a grayscale version
let imgData = ctx.getImageData(0, 0, width, height, {matte:'white', density:2})
await imgData.toSharp().grayscale().png().toFile("black-and-white.png")

// Create an image using Sharp then draw it to the canvas as an Image object
let sharpImage = sharp({create:{ width:x, height:y, channels:4, background:"skyblue" }})
let canvasImage = await loadImage(sharpImage)
ctx.drawImage(canvasImage, x, 0)
await canvas.saveAs('mosaic.png')
```

## 基准

在这些基准中,Skia Canvas通过两种模式进行测试:串行和Aync. 连续运行时,每次渲染操作都要等待到继续到下一次测试迭代. 在同步运行时,所有测试迭代会立即启动,并使用库的多行支持并行执行.

[看这里的全部结果..](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/index.md)

### [启动延迟](https://github.com/samizdatco/canvas-benchmarks/tree/main/tests/cold-start.js)

| 图书馆 | 每个运行 | 总时间(100次重复) |
| --- | --- | --- |
| _画布基特 - wasm_    |   `25 ms` |  `2.47 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#cold-start_wasm) |
| _画布_    |   `88 ms` |  `8.77 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#cold-start_canvas) |
| _@napi-rs/canvas (英语)_    |   `69 ms` |  `6.87 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#cold-start_napi) |
| _扫描片_    |   `<1 ms` |   `33 ms` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#cold-start_skia-sync) |

### [贝塞尔曲线](https://github.com/samizdatco/canvas-benchmarks/tree/main/tests/beziers.js)

| 图书馆 | 每个运行 | 总时间(20次重复) |
| --- | --- | --- |
| _画布基特 - wasm_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/beziers_wasm.png) |  `790 ms` | `15.81 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#beziers_wasm) |
| _画布_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/beziers_canvas.png) |  `486 ms` |  `9.72 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#beziers_canvas) |
| _@napi-rs/canvas (英语)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/beziers_napi.png) |  `230 ms` |  `4.60 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#beziers_napi) |
| _轮廓( 连续)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/beziers_skia-sync.png) |  `137 ms` |  `2.74 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#beziers_skia-sync) |
| _扫描( 同步)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/beziers_skia-async.png) |   `28 ms` |  `558 ms` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#beziers_skia-async) |

### [SVG至巴布亚新几内亚](https://github.com/samizdatco/canvas-benchmarks/tree/main/tests/from-svg.js)

| 图书馆 | 每个运行 | 总时间(100次重复) |
| --- | --- | --- |
| 画布基特 - wasm |  `—————`  |  `—————`    _不支持_ |
| _画布_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/from-svg_canvas.png) |  `122 ms` | `12.16 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#from-svg_canvas) |
| _@napi-rs/canvas (英语)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/from-svg_napi.png) |   `84 ms` |  `8.42 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#from-svg_napi) |
| _轮廓( 连续)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/from-svg_skia-sync.png) |   `58 ms` |  `5.83 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#from-svg_skia-sync) |
| _扫描( 同步)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/from-svg_skia-async.png) |   `11 ms` |  `1.08 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#from-svg_skia-async) |

### [缩放/旋转图像](https://github.com/samizdatco/canvas-benchmarks/tree/main/tests/image-blit.js)

| 图书馆 | 每个运行 | 总时间(50次重复) |
| --- | --- | --- |
| _画布基特 - wasm_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/image-blit_wasm.png) |  `274 ms` | `13.72 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#image-blit_wasm) |
| _画布_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/image-blit_canvas.png) |  `283 ms` | `14.13 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#image-blit_canvas) |
| _@napi-rs/canvas (英语)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/image-blit_napi.png) |  `112 ms` |  `5.60 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#image-blit_napi) |
| _轮廓( 连续)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/image-blit_skia-sync.png) |  `100 ms` |  `5.00 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#image-blit_skia-sync) |
| _扫描( 同步)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/image-blit_skia-async.png) |   `19 ms` |  `935 ms` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#image-blit_skia-async) |

### [基本案文](https://github.com/samizdatco/canvas-benchmarks/tree/main/tests/text.js)

| 图书馆 | 每个运行 | 总时间(200次重复) |
| --- | --- | --- |
| _画布基特 - wasm_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/text_wasm.png) |   `24 ms` |  `4.75 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#text_wasm) |
| _画布_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/text_canvas.png) |   `24 ms` |  `4.88 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#text_canvas) |
| _@napi-rs/canvas (英语)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/text_napi.png) |   `19 ms` |  `3.83 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#text_napi) |
| _轮廓( 连续)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/text_skia-sync.png) |   `21 ms` |  `4.26 s` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#text_skia-sync) |
| _扫描( 同步)_ [👁️](https://github.com/samizdatco/canvas-benchmarks/blob/main/results/darwin-arm64/2025-09-26/snapshots/text_skia-async.png) |    `4 ms` |  `819 ms` ![ ](https://npmcn.com/package/%40documenso/skia-canvas/docs/assets/benchmarks.svg#text_skia-async) |

## 鸣谢

这个项目深深地感激联合国 [Rust Skia项目](https://github.com/rust-skia/rust-skia) 它的Skia绑定提供了安全和平庸的接口 来应对C++的混乱 多亏了开发商 [节点扫描](https://github.com/Automattic/node-canvas) 他们的一套出色的单位测试。 在无 [酸性测试](https://www.acidtests.org/) 对于帆布,这些例行公事是宝贵的.

### 著名捐助者

-   [@mpaparno (英语)](https://github.com/mpaparno) 向 SVG 渲染、原始图像缓存处理、 WEBP 导入/导出和众多错误修正提供了支持
-   [@ 沙门德克思](https://github.com/Salmondx) 开发初始 Raw 图像加载和渲染常规
-   [@lucasmerlin (英语)](https://github.com/lucasmerlin) 帮助GPU在Vulkan上工作
-   [@cprecioso (英语)](https://github.com/cprecioso) 打开 [@saantonandre (英语)](https://github.com/saantonandre) 在 TypeScript 类型定义上更正和扩展
-   [@meihuanyu (英语)](https://github.com/meihuanyu) 贡献过滤器和路径渲染修正

## 版权

2020–2025 (中文(简体) ) [萨米兹达特起草公司.](https://samizdat.co/)

## 常见问题

### @documenso/skia-canvas 是什么？

多线程的 GPU 加速 Canvas API 用于节点

### 如何安装 @documenso/skia-canvas？

在项目目录运行 npm install @documenso/skia-canvas，或使用 pnpm add / yarn add / bun add。

### @documenso/skia-canvas 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @documenso/skia-canvas 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @documenso/skia-canvas 可以商用吗？

@documenso/skia-canvas 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @documenso/skia-canvas 的下载量有多少？

根据 npm 官方下载统计，@documenso/skia-canvas 在 2026/10/13 – 2026/11/11 这 30 天内被下载 19,557 次，日均约 652 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @documenso/skia-canvas 还在维护吗？

最新版本 3\.0\.8-documenso\.3 发布于 2026/08/13（3 个月前）；至今共发布 2 个版本，其中过去 12 个月发布了 2 个；首次发布于 2026/08/13。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。