如何开始使用JavaScript Canvas动画

或者说我的游戏开发梦想是如何从动画一个方块开始的…

我热爱玩游戏，也热爱编程。有一天我开始思考，为什么不利用编程技能来制作游戏呢？但这听起来很难。一个人该如何开始？

从婴儿学步开始。👣

在本文中，我们将学习使用HTML5 Canvas和JavaScript来绘制和动画对象，然后进行性能优化。

“动画不是移动的绘画艺术，而是被绘制的运动艺术。” — Norman McLaren

介绍

苹果公司在2004年推出了Canvas来支持应用程序和Safari浏览器。几年后，它被WHATWG标准化。它提供了更精细的渲染控制，但代价是需要手动管理每个细节。换句话说，它可以处理许多对象，但我们需要详细编写所有代码。

Canvas有一个2D绘图上下文，用于绘制形状、文本、图像和其他对象。首先，我们选择颜色和画笔，然后进行绘制。我们可以在每次新绘图前更改画笔和颜色，或者继续使用现有的工具。

创建帐户以阅读完整故事。作者仅向Medium会员提供此故事。如果您是Medium的新用户，请创建一个新帐户来阅读此故事。

在应用中继续或者，在移动网页中继续使用Google注册使用Facebook注册使用电子邮件注册已经有帐户？登录

Jeff Gilliland 2021年5月25日（编辑）理解Canvas的一些基础技术的好文章。你检查过three.js吗？它抽象并简化了许多这些交互。

Christoph Schober 2021年12月21日很好，谢谢，对于简单的2D动画，你有什么偏好的库吗？还是你总是手动完成？