fabric和konva主要是用于实现编辑器的场景，而Pixi则是一个高性能2D动画渲染库，通常用于一些H5的小游戏或可交互页面。

本次通过以下几个方面来对其进行分析：

• WebGL与Canvas渲染器
• 资源加载器与纹理
• 场景、精灵与图形对象
• 变换、交互及动画处理

阅读全文

与古老的Fabric相比，Konva的使用更为便捷，性能更加优益，这些得益于其内部的种种设计，本次通过以下几个方面来对其进行分析：

• 基础元素及上下文的扩展
• 图形变换处理(变换计算及独立的图形控制器)
• 光标交互处理(基于像素的目标检测)
• 层级渲染处理

阅读全文

了解Canvas2D渲染功能实现与设计，在使用时知其所以然，在创造时有所借鉴。从以下这四个方面来分析Fabric.js

• 对象模型处理(使用及设计实现)
• 图形变换处理(canvas与object变换)
• 光标交互处理(目标检测与事件处理)
• 画布与对象渲染处理(多层结构与多阶段绘制)

阅读全文

针对具有复杂canvas交互操作的e2e测试，尝试使用puppeteer模拟复杂canvas交互，自动执行相关测试用例，利于减少重复的人工验证和回归测试。

主要做了封装通用操作，添加操作辅助类，与测试工具集成，结果验证等工作。

阅读全文

Tl;DR：

1. OffscreenCanvas可以让你在Worker线程中渲染图形，支持多种RenderingContext
2. 两种使用方式：同步的Transfer模式与异步的Control模式
3. 将Canvas的逻辑计算与渲染分离，避免UI线程阻塞

阅读全文

关于canvas的使用经验及深入学习总结，主要有以下几个方面：

1. 基础绘图、平滑曲线和交互变换
2. 状态管理及图像处理
3. 性能优化与绘制原理

阅读全文

总结在使用canvas时遇到的一些通用效果实现与相关示例。

阅读全文