声明：
原文链接：http://www.softr.li/blog/2012/06/20/which-html5-canvas-javascript-library-should-i-use
本译文地址：http://jo2.org/html5-canvas-libary-introduction/
转载请保留。。
《我应该选哪个Canvas库？》译文（以下的“我”是指原作者）：
我一直在找一个Html5 canvas库，可以让我创建可交互的、带动画的UI界面。我的要求是：
- 良好的文档，支持与维护，因为我想在以后的项目里还能重用它
- 可以轻松的创造复杂的图形对象（我的工程比较复杂，可不是一个简单的按钮那样的活儿），最好能支持分组和多层
- 能帮我处理用户交互
- 支持触摸设备
- 提供用于作动态图形的工具
我搜了一些适合的库，想和你分享我的搜索成果。在可用的库的名单后面，我调查了这些库：EaselJS,fabric.js,Paper.js,processing.js和Kinetic.js，希望能帮你做出你自己的选择。
我找到的库
这儿是一些迄今为止看起来还有人维护的Canvas库：
这儿还有一些我没有研究过的库，因为他们没有架在Github上，或者看起来没人更新了：
在Github上的对比
| 库 | 关注 | 分支 | 问题 |
|---|---|---|---|
| CAAT | 336 | 42 | 17 |
| EaselJS | 1,440 | 203 | 90 |
| fabric.js | 1,059 | 101 | 38 |
| gury | 348 | 19 | 9 |
| jCanvaScript | 80 | 5 | 2 |
| Kinetic.js | 267 | 41 | 7 |
| oCanvas | 194 | 20 | 6 |
| Paper.js | 1,706 | 111 | 30 |
| processing.js | 1,276 | 206 | N/A |
最小体积对比
| 库 | 代码量 (KB) |
|---|---|
| CAAT | 210 |
| EaselJS | 44 |
| fabric.js | 133 |
| gury | 11 |
| Kinetic.js | 53 |
| oCanvas | 18 |
不过jCanvaScript,Paper.js和processing.js在Github是没有压缩版
在Stackoverflow的比较
| 搜索词 | 标签 | # 被标记的问题 | # 搜索到的问题 |
|---|---|---|---|
| CAAT | N/A | N/A | 5 |
| EaselJS | easeljs | 30 | 79 |
| fabric.js | fabricjs | 43 | 78 |
| jCanvaScript | N/A | N/A | 6 |
| Kinetic.js | kineticjs | 74 | 30 |
| oCanvas | N/A | N/A | 19 |
| Paper.js | paperjs | 9 | 49 |
| processing.js | processing.js | 117 | 289 |
gury库在stackoverflow上没找到，我用N/A标识了没找到的。
对文档，教程和其他资源的研究
在选择框架时，我更看重Github的比较。他能提供库的开发状态概览以及正在用这个库的社区。在我并不想变成某领域的专家时，我希望能依靠社区（解决问题）。
但是，StackOverflow(SO)太有用了，尤其在已经有人问了比较问题的时候，比如：Current state of Javascript canvas libraries
于是，我打算就文档，教程和其他资源，给出一个深入的评论。对比：EaselJS, fabric.js, Paper.js, processing.js 以及这个外来者：Kinetic.js,来做个选择。
摘要
EaselJS, fabric.js, Paper.js, processing.js可以看作是4个领头者，他们有很明确的庞大用户社区，也架设在Github上，文档完善，大量的引用（就是在SO上的问题，以及论坛），更好的是，根据SO上他们之前的问题，他们是有单元测试的。
Kinetic.js是个后来者，最近才上线Github，还有很多变数，但受到了kangax的（Fabric.js的作者）热烈欢迎。
这4个库都有Github地址，都基于MIT许可发布。
EaselJS
这个库是CreateJS 套件的一部分，是一个全功能的用来创建先进html5交互与动画图形库。
特别的是，结合动画库（TweenJS），可以创建很复杂的动画！如果你打算开发游戏，你还可以用SoundJS库和资源预载入库（PreloadJS）搞定。
这个网站提供了一些漂亮的示例，源码可以和Github宝库上找到。
这个库看起来也能和其他库协同工作，比如Box2d和TexturePacker.
内置对触摸设备的支持
fabric.js
查看官网发现，此库貌似偏向建立“矢量图形编辑工具”。主要特色有：
- 创建和操作（移动，缩放，旋转…）矢量图形和文本对象
- 导入/导出成SVG或反过来
总结起来就是“一个在canvas上的可交互对象模型”。
如果你的目的是建立复杂场景，动态对象，在我看来他不是正确选择。
Paper.js
这个库是Scriptographer库的一部分。他有个特长是其Paperscript语言，基于一个提供了对点和图形精妙进行精妙数学操作的Javascript扩展——但是，他仍然没有文档。
这个库的强大在于，他在建立复杂矢量对象和管理鼠标交互上出类拔萃。然而，他没有实现对移动设备的支持，而且其动画能力貌似被 onFrame() 这个方法限制了——每秒被调用60次，也允许你改变canvas的内容。
processing.js
这个库的核心目标是建立可视化交互
这个库有个独特的历史——他是著名的Processing库的一个接口。我说著名，不是因为我自己知道，而是因为他在多媒体艺术社区非常知名，用来进行交互式艺术创造。
请看这第一个示例,看起来此库打算降低在canvas上创建交互式图形动画的学习曲线。他提供了易用的循环，和一个 draw() 方法，你可以简单的建立你的可视化交互。
我认为，因为其学习曲线低，对没有开发能力的艺术家们是完美的，但并不是建立面向对象组件的最佳工具。
Kinetic.js
Kinetic.js本是这次比较的门外汉，因为在他的Github上看起来，他离最多人使用的那个还很远。然而，如果搜索”canvas library”的话，他的html5教程是排在第一位的，而且，他在SO上也有很多不错的提问。
这个名字是个很好的线索，但这个库在处理大量对象的时候蛮快的，因为使用了多canvas技术。
他提供了很好的文档讲解和教程，包括系统的html5 canvas应用，详细的Kinetic.js和Three.js文档。他也提供了些好用的小提示——不是针对这个库的，有的是对于canvas。
结论
基于本篇评论，我认为我应该用EaselJS或Kinetic.js。Paper.js也不错但是不支持触摸设备，我敢肯定要集成这个功能并不复杂，但我更喜欢库中本来就有的。
最后，我决定用Kinetic.js，因为：
- 我觉得示例代码不错
- 作者本身写了一个优秀的系列教程
- 文档和例子都很清晰易懂
- 我要的库里都有了（我并不觉得在我做到20%的时候却需要引进另一个大库比如TweenJS来解决个小问题会让我高兴）
请不吝分享你的评论，或者我没提到的库，谢谢。
—————————————————-
译者的总结：
翻译完了觉得这文章有点像Kinetic.js的软广告。不过，上面的所有库功能都是非常强大的，日常应用毫无问题。Kinetic.js是综合来讲比较合理的一个——功能中等，体积中等。
个人觉得fabric.js最强大，体积也最大；Paper.js其次。
另外，在对比了国外的教程和我写的教程后，不知道我写的教程还有人看吗？——虽然，我也是完全原创的，但我的技术可比不上外国作者，唉
3590
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
