作者 HTML5 需要代言人来推动发展。有很多人都承担了这个角色，我们在 Mozilla 认为，通过一系列访谈和短视频，将他们介绍给你们是一个好主意。形式很简单——我们向专家们提出 10 个问题，让他们作答，然后进行简短的视频访谈，让他们自我介绍，并详细解答一些问题的答案。
Leggi la traduzione in italiano
今天我们重点介绍的是 Rob Hawkes，他是 Rawkets 的作者，Rawkets 是一款使用 Canvas 和 WebSocket 的多人游戏。
Rob 是 2010 年在英国伦敦举办的 Game On 活动的演讲嘉宾之一，他在活动上展示了他的游戏。视频和幻灯片可以在 Mozilla 游戏博客上找到。他目前正在忙于撰写 一本关于 Canvas 的书。你可以在 Twitter 上找到 Rob，他的用户名是 @robhawkes。
Rob 传达给我的一条我非常喜欢的信息是，使用任何你想要的技术都没有问题，而且人们对你的代码进行修改是有益处的——即使是为了作弊。
视频访谈
你可以在 任何支持 HTML5 的设备上观看此视频（由 vid.ly 提供）。
关于 HTML5 的十个问题，针对 Rob Hawkes
1) 那么，你一直在用 Canvas 做游戏开发——为什么对它如此着迷？你之前在其他环境中编写过游戏吗？
当然有。在过去的一两年里，我的生活几乎都围绕着制作各种游戏展开。我只是喜欢用游戏来实验编程语言，并真正学习关于它们的知识。这也是尝试视觉编程中大多数功能的好方法，特别是像物理学这样更难的概念，我仍然不是专家。我对游戏编程的迷恋实际上源于必要性；我在大学二年级时必须制作一款游戏，所以我与人合作开发了一款使用 Papervision3D 和 ActionScript 的 增强现实游戏。之后，我与人合作在 Adobe Flex 中开发了另一种游戏，允许人们 使用网络摄像头进行对战，这很有趣。现在我在 Canvas 中制作游戏；部分原因是它很有趣，部分原因是为了学习尽可能多的知识。我从游戏中获得的互动性和可玩性因素让我感到兴奋，我认为这与我对视觉编程的整体迷恋相呼应。
2) 开放式技术的妙处在于，很容易看到底层发生了什么。查看源代码，你就能了解情况。对于游戏来说，这不是问题吗？至少对于 Flash 游戏来说，要“作弊”修改高分需要进行一些 HTTP 嗅探——使用 Canvas 似乎更容易。你如何保护自己免受此类攻击？
Canvas 如此开放的事实让我对它产生了兴趣。我通常对编程非常开放，我希望人们能从我的代码中学习，因此能够直接在浏览器中查看源代码对于这一点来说非常棒。然而，主要的缺点是你的代码对每个人都可见，因此安全性成为了一个非常大的问题。
你说得对，这在游戏中尤其麻烦，我倾向于认为对此你无能为力。事实上，在我发布 Rawkets 的第一个版本后不久，人们就开始探查代码并操纵游戏以达到自己的目的。
老实说，我实际上认为这是一件好事，因为它向我展示了我的代码哪里薄弱，并突出了我需要加强的领域。你可以尽可能地混淆和压缩你的代码，但人们仍然可以访问它，因为这就是 JavaScript 的工作原理。但是，有一些方法可以缓解这个问题，例如将游戏的核心逻辑传递给远程服务器，并通过限制性和安全的 API 调用与之通信。对于多人游戏来说，这是一个不错的方法，其中从服务器接收到的数据被视为可信的，而客户端侧的数据则不可信。或者，你可以将敏感代码包装在闭包中，并利用局部变量隐藏不想让人们轻易访问的数据。另一种选择是根本不用担心。只要你不让黑客破坏其他玩家的游戏体验，他们是否在自己的浏览器中搞砸了游戏真的重要吗？
实际上，这些方法都不能提供 100% 的保护，但它们肯定会让那些想要作弊的人更加困难。
3) 说到开放。Canvas 不就是一个具有预定义 API 且无需缓慢的 JVM 的 Java Applet 吗？你仍然只是在页面中的某个位置有一个可以操纵的矩形……
如果你指的是 Canvas 就像一个沙盒，你只能通过一组特定的 API 调用访问它，那么是的，基本上就是这样。再说一次，API 调用可以让你做很多事情，难道你不能对 Flash 和所有创建图形的封闭方法说同样的话吗？
我想当你称 Canvas 为开放时，你主要指的是其创建背后的开发（即 W3C），以及绘制元素的代码没有隐藏在窥探者的视线之外。Canvas 绝对不是开放的，你无法自由地扩展它并随心所欲地使用它。只要你遵守 API 调用，这在 99% 的时间里都是可以的，那么你就没有问题。
正如你所说，Canvas 实际上只是一个浏览器允许你绘制的矩形区域。一旦你在其中绘制了一些形状，你就无法单独访问它们，但话说回来，这正是 Canvas 的工作原理。它不像 SVG，你绘制的每个元素都可以从 DOM 访问和编辑。Canvas 是一个位图系统，它没有单个元素的概念。它是一个破坏性系统，基本上只是根据你提供的 API 调用更改其矩形内的像素颜色。从这个意义上说，它就像过去的 Microsoft 画图一样。
4) 可访问性怎么样？辅助技术可以访问 Canvas 内容吗？键盘访问呢？
坦率地说，不能。至少，目前还不行。
Canvas 确实有回退内容，它放置在 Canvas 标签之间，当浏览器不支持 Canvas 时显示，但它没有太多其他东西可以帮助可访问性。回退内容的妙处在于，可以在其中放置键盘访问的内容。我相信 IE9 已经具备了此功能，它允许你显示 Canvas，但仍然提供键盘访问，以便你可以用文本描述 Canvas 中的内容，或者类似的东西。这种方法的问题在于，你实际上复制了所有内容；你在 Canvas 上绘制所有内容，然后你必须在 Canvas 标签内写下所有内容来解释你绘制的内容。
你目前还无法为 Canvas 中的单个元素提供辅助访问，因为 Canvas 只是一个像素的大矩形，没有关于绘制内容的概念。这是使用具有相当封闭 API 的位图系统的最大缺点。有人在讨论使用名为 Shadow DOM 的东西来打开 Canvas 并允许某种方式访问已绘制的元素，但我认为目前还没有做太多这方面的事情。
我非常期待看到这方面的进展，但在此期间，Bruce Lawson 强调了一些关于解决 Canvas 可访问性问题的提案。
5) 性能如何？保持 Canvas 游戏流畅运行的最佳技巧是什么？
这是 Canvas 目前的一个主要问题；它可能非常慢！实际上，这不是 Canvas 本身的问题，而是 Canvas 使用浏览器进程来绘制所有内容，而浏览器进程又使用处理器（CPU）。
一些浏览器正在引入名为硬件加速的功能，它将 Canvas 和图形处理传递给显卡（GPU）。这个简单的功能确实可以提高速度，并允许你做一些非常密集的事情。但是，硬件加速并不是灵丹妙药；你仍然需要进行防御性编程，并注意代码中潜在的瓶颈和性能问题。
最常见的问题出现在不必要的奢侈定时器和循环中。例如，Canvas 中的动画通常需要使用 JavaScript 超时，它每秒运行 30 次绘制 Canvas 上所有内容的函数；足够快，看起来就像东西在移动。这很好，但是如果你不再动画化任何东西呢？我犯过没有关闭动画定时器的错误，从而毫无理由地消耗宝贵的 CPU 资源。
另一个例子是碰撞检测，或者任何必须对大量对象执行的检查。错误的做法是对每个对象进行循环，然后在原始循环的每次迭代中再次对每个对象进行循环。这样做的弊端在于，你最终会检查某些对象两次或更多次，并浪费资源。相反，你可以优化循环以忽略你已经检查过的对象，这可以大大减少循环次数。
优化代码的方法不胜枚举，大多数方法本身并不能取得多大成就，但它们加起来可以节省相当多的资源。
6) 你的游戏使用 WebSocket 进行通信。你发现它如何工作？它是否具有良好的可扩展性？你对这项技术有什么不喜欢的地方？
你是说它曾经使用过 WebSocket 吗？很遗憾，Firefox 和其他浏览器决定暂时放弃对它的支持，真是个好主意。说笑归说笑，这款游戏是建立在 WebSocket 之上的，这趟旅程很有趣。我喜欢 WebSocket，我认为在浏览器中拥有全双工通信方法非常棒。数据实时流传输的事实为游戏和 Web 应用开辟了无限的可能性。
在稳定性和可扩展性方面，我没有发现 WebSocket 有太多问题，因为实际上大部分问题都出在处理来回发送信息的服务器端代码上。我发现你需要注意的一点是，如果你不习惯为大量用户优化通信，那么来回发送的数据量可能会呈指数级增长。
不过我必须承认，我对 WebSocket 最大的抱怨是它以文本形式发送数据，并且不支持 UDP 协议。目前，WebSocket 将所有数据作为文本数据发送非常好，因为它非常简单，但很糟糕，因为它可能会消耗大量宝贵的带宽，尤其是在你每秒向游戏中数百个不同的玩家发送数据多次时。
UDP 问题与 Canvas 目前仅支持 TCP 协议有关。这意味着在服务器和客户端之间来回发送的每一段数据都必须按顺序接收。这对游戏来说不是一件好事，因为一点延迟会导致消息积压，这些消息必须按顺序发送才能发送任何新消息。另一方面，UDP 允许你随时发送消息，而不用担心顺序。这对于依赖于时间敏感的精确数据的游戏来说非常有用，例如 FPS 游戏中玩家的移动。
你必须记住，WebSocket 是一项新技术，一开始可能会遇到一些问题；因此它被暂时禁用。尽管如此，它仍然拥有光明的前景，我期待着看到它的发展。
7) 你也玩过 SVG 吗？如果是的话，你将在何时使用哪种技术，是否有机会将两种技术的优点结合起来？
诚然，我玩 SVG 的次数不如我想象的那么多。在最近几个月里，我完全沉浸在 Canvas 的世界里。但是，我相信在特定情况下应该使用它而不是 Canvas，例如在将现有的 HTML 数据转换为图形格式时（例如，从表格创建图表）。
SVG 也非常棒，因为它可以通过 DOM 访问，但在动画和游戏中却有所不足。它最初并不是为这种用途而设计的，这也是 Canvas 存在的原因。Canvas 非常适合快速动态的动画，尤其适合创建游戏。
幸运的是，SVG 和 Canvas 不总是只能二选一。完全 可以在 Canvas 中绘制 SVG 形状，这额外的好处是让你可以在位图系统中拥有 SVG 的所有矢量优点。我听说有人将这种技术用于游戏中的精灵，以及绘制需要大量调整大小的 Canvas 图像。
8) 你希望看到打开的下一个障碍是什么？封闭式技术的哪些功能超出了你的能力范围，但你却渴望尝试？
我真的很期待看到主要浏览器支持设备 API (DAP)。目前浏览器缺少的一件事是对外部设备（如网络摄像头和麦克风）的支持。我可以看到 Canvas 和 DAP 结合起来，可以用于一些非常棒的 Web 应用和可视化。想象一下，通过使用带有连接网络摄像头的 Canvas 来为网站创建头像。或者，通过浏览器使用 WebSockets 和 Canvas/HTML5 视频进行实时视频聊天？那将是 JavaScript 的精彩应用！
9) 目前你正在写一本关于 Canvas 的书。由于不是每个人都有时间等待，那么在等待期间，人们可以在哪里获取开始使用 Canvas 的真实信息？
等待时间不会太长（将在 5 月份出版），但在此期间，我建议访问Mozilla 开发者网络。我就是在那里学习如何使用 Canvas 的，所以它一定很棒！除此之外，目前真正缺乏学习 Canvas 的优质资源，但我预计这种情况在未来一年内会得到改善。
10) 人们可以去哪里获取灵感？你见过哪些其他 Canvas 的应用让你觉得“哇，我想要那个！”？
目前，有一些很棒的项目正在使用 Canvas 创建。我可以列出一个很长的清单，但这里有一些我最喜欢的：
一些特别令人印象深刻的 Canvas 应用激发了我的灵感，这些项目真正发挥了 Canvas 的像素操作功能，例如使用它来检测图像中的面部，或识别裸体。很奇怪，但非常令人印象深刻！
你认识哪些人适合我为“HTML5 人物”栏目进行采访？请在 Twitter 上告诉我：@codepo8
关于 Chris Heilmann
HTML5 和开放网络的布道者。让我们一起修复它！