HTML Canvas drawing/animation 框架(或至少框架的大部分)是否仍然有必要,例如 processing.js?

Are basic HTML Canvas drawing/animation frameworks (or at least large portions of a framework), such as processing.js still necessary?

请允许我解释一下,这样才不会被标记为 "opinion-based" 问题。

我现在正在学习 processing.js,我不禁注意到在功能上与 Vanilla 的 Canvas API 中已有的许多相似之处- JS。 也许写一组大型动画在plain old Canvas中比在processing中复杂得多?

我问这个是因为,随着我继续了解有关香草 APIs 的更多信息,我看到多年来在 JS 中添加了许多新功能开始(非常缓慢地)制作不再需要的流行框架的某些方面(jQuery 是一个很好的例子)。我很好奇 Canvas 和 processing.js 是否也是这种情况。

就我个人而言,我正在尝试确定我是否仍应在 processing.js 上花费大量时间(不过我并不是要你为我做出这个决定,但我只想要一些信息来帮助我决定什么对我最有利)。

Whosebug 允许提出有关 ProcessingJS 等编程工具的特定非编码问题,但您的问题似乎过于宽泛,可能会被关闭。

即便如此,这是我的想法...

本机 Canvas 与 ProcessingJS

  • Html5 canvas 天生具有可与 Photoshop 相媲美的丰富可能性。但是,原生 canvas 是一个相对较低级别的工具,您必须使用自己的代码处理结构化、事件、序列化和动画。

  • ProcessingJS 为原生 canvas 添加了结构、事件、序列化、动画和许多(惊人的!)数学函数。恕我直言,ProcessingJS 是一个更高级的工具,非常值得学习。

将本机 canvas 扩展到更高级别的工具而不是低级别的工具

  • 使用大约 500 行 javascript,您可以向原生 canvas 添加一个可重用的框架,将这些功能添加到更高级别的结构中:事件处理(包括 drag/drop、缩放、旋转、命中测试等),序列化/反序列化。

  • 通过大约 100 行代码,您可以向原生 canvas 添加一个可重用的框架,该框架通过缓动来制作动画。

  • 尽管原生 canvas 天生就具备呈现复杂内容所需的大部分功能,但原生 canvas 仍然非常需要 PathObject。 PathObject 将序列化路径以使其可重用。使用大约 50 行,您可以创建一个可重用的 PathObject。

这是一个相当无用的建议:-p

尝试使用正确的工具来完成工作(是的,不是特别有用)。

  • 学习原生canvas一个人就能搞定,大概70%的像素显示任务。

  • 编码扩展(以上)将使您达到 90%。

  • 使用像 ProcessingJS 这样的工具会让你达到 98%。

  • 是的,总有大约 2% 的边缘情况,您 "can't get there" 或者必须降低设计要求以适应编码限制。

稍微具体一点的建议

由于 ProcessingJS 只是扩展原生 canvas,恕我直言,花几天时间学习原生 canvas 是非常值得的。这些知识将使您确定适合该工作的工具。