一个简单的无限画布教程

241 天前
 xiaoiver

一些知名产品包括 FigmaModyfirnotetldrawexcalidraw等等都会使用无限画布。

作为一个前端,我对其中涉及到的渲染技术很感兴趣。尽管 tldrawexcalidraw 等普遍使用易用性更高的 Canvas2D / SVG 技术,但 JS 和 Rust 生态中也有很多编辑器、设计工具使用更底层的渲染技术对 2D 图形进行 GPU 加速,以获得更好的性能和体验,例如:

因此我想通过一份教程一步步实现一个简单的无限画布,主要通过 WebGL1/2 和 WebGPU 实现高性能渲染。 目前写了 7 小节,希望能得到大家的支持和鼓励。

这是教程地址: https://infinitecanvas.cc/zh/lesson-001

486 次点击
所在节点    前端开发
2 条回复
daolanfler
174 天前
好东西,顶一下!值得被更多人看到
zzq825924
25 天前
太牛了

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1035816

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX