独立开发前线
返回产品列表
L

LeaferJS

好用的 Canvas 引擎,轻松实现图形交互与编辑,AI 时代的无限画布引擎

访问产品
1 推荐
0(0)
LeaferJS screenshot 1
LeaferJS screenshot 2

产品介绍

LeaferJS:好用的 Canvas 引擎

轻松实现图形交互与编辑,AI 时代的无限画布引擎

官网: leaferjs.com

👉 在浏览器里 “跑得动 100 万个图形” 的 Canvas 引擎
👉 可以做 “Figma 级编辑器” 的 Canvas 内核

极致性能 · 极低内存 · 类 DOM API · 图形编辑 · 跨平台 · 零依赖 · 轻量 (70KB min+gzip)

🧐 为什么选择LeaferJS?

在 Web 图形开发中,开发者常面临“性能与易用性”的选型困境。

LeaferJS 致力于终结这种权衡。 它从底层重构,不仅在性能上挑战 Web 渲染和交互的物理极限,更在开发体验上追求极致的简单。它是为了解决“大规模、高密度、海量图层”的生产力工具而诞生的标准化引擎。

🏗️ 为什么是 AI 时代的无限画布引擎?

在 AI 生成内容爆发的今天,图形引擎的挑战已从 “如何画出来” 转变为 “如何编排与精修”

  • ⚡ 极致承载力: 突破极限,百万交互图层依然保持丝滑响应,完美承载 AI 生成的海量碎片。
  • 🤖 语义化编辑: 结构化场景树让 AI 能像操作 DOM 一样操控图形,构建真正的 AI 协同工作流。
  • 🛠️ 原生编辑器: 内置 Editor 插件,让AI 生成的内容一键获得精准旋转、缩放、多选等工业级编辑能力。

Leafer AI 知识库 | MCP & Skills | Ask AI

🎨 应用场景

LeaferJS 的极致性能与标准化能力,使其成为以下领域的理想底座:

  • 🤖 AI 场景: AI 无限画布、AI 设计工具、生成式 UI 交互。
  • 🛠️ 生产力工具: 图形编辑器、在线设计平台(Figma/Canva 类)、电子白板、低代码引擎。
  • 📊 工业可视化: 万级节点电力组态、流程图、资产监控、大规模拓扑图。
  • 🎬 数字内容生成: 批量生成图片/海报、短视频帧渲染(Node.js 端)、互动 H5。
  • 🎮 互动应用: 轻量小游戏、品牌互动应用、高频交互数据大屏。

🔥 性能表现

LeaferJS 将 Web 图形处理的“天花板”向上推举了约 10 倍。

测试项 (100万个可交互矩形)传统 Canvas 库LeaferJS提升
首屏创建速度~9-15 秒1.28 秒约快 8 倍 🎉
内存占用~2-4GB (浏览器可能崩溃)320 MB约节省 8 倍
单元素拖拽帧率0-4 FPS60 FPS约流畅 15 倍

测试环境: 2K屏笔记本 / Chrome V143.0,数据仅供参考,实际表现取决于硬件性能。

性能对比详情 | 性能基准测试

⚡️ 核心能力

  • 🎨 强大的图形系统: 完整的场景树结构,支持矢量图形、SVG 路径及像素操作。
  • 🧠 极致的交互响应: 原生支持拖拽、缩放、多点触控,毫秒级的命中检测(Hit Testing)。
  • 🛠️ 原生编辑器支持: 内置 Editor 插件,一键开启图形的缩放、旋转、移动、多选等功能。
  • 🧩 现代布局引擎: 业内罕见地在 Canvas 引擎中原生支持 Flex 布局,像写 HTML 一样自然。
  • 🎬 状态驱动动画: 内置高性能过渡效果与路径动画,让动态交互更简单。
  • 🌍 全平台适配: 一套代码完美运行于 Web、Node.js、微信小程序及移动端 H5 环境。

功能列表详情 | 在线体验

💼 商业支持与可持续性

从“一个引擎”到“一个成熟产品”之间存在巨大的研发鸿沟。为了支持开源引擎的长久维护,并协助企业跨越复杂场景的开发瓶颈,我们构建了透明且健康的生态:

  • LeaferJS 永久开源 (MIT): 核心功能和基础插件始终保持开源与自由,保障每一位开发者的选型安全与技术掌控权。
  • PxGrow 商业插件 (可选): 专注于解决工业级应用中的复杂业务难题。它封装了高级编辑器套件、极端场景性能优化及复杂图形算法,旨在帮企业节省数月甚至数年的业务功能研发周期。
  • 良性循环与长期主义: 所有的商业收入将用于反哺开源引擎的持续迭代,确保 LeaferJS 始终处于 Web 图形技术的领先水平。

LeaferJS 仓库组成一览表

仓库名称功能描述开源地址
LeaferJS主集成仓库,支持直接运行代码GitHub
leafer引擎核心仓库GitHub
leafer-uiUI 表现层仓库GitHub
leafer-in官方插件仓库GitHub
leafer-x社区插件提交/展示仓库GitHub
test自动化测试仓库GitHub
code示例代码仓库GitHub
docs在线文档仓库GitHub

🌟 参与贡献:五年沉淀,始于初心

LeaferJS 是一个持续打磨了五年的原创开源引擎。我们致力于把“图形系统底座”这件事标准化,让开发者专注产品创意,而非底层实现。

如果你支持原创、追求极致性能,请为我们点亮一颗 Star!

  • 🌟 Star 仓库: 你的认可对我们至关重要。
  • 🐞 提交反馈: 每一个 Issue 都是我们进步的机会。
  • 🤝 加入社区: 与社区开发者共同探索 Web 图形技术的极限。

标签

AI开源免费

发布信息

分类开发者工具
上线时间2026-07-05
推荐数1
评分0

创始人

Leafer

Leafer

北京

0.0

0 条评价

登录后可以评分、写评价并推荐产品

去登录

暂无评价,来发表第一条评价吧