javascript 面向 Web 和移动设备的 Flash 与 HTML5 游戏开发

Flash vs HTML5 game development for web & mobile

提问by André Staltz

I am an experienced AS3 programmer, and I've done Flash apps and games on the browser and on mobile (via Adobe AIR, e.g., on Android).

我是一名经验丰富的 AS3 程序员，我已经在浏览器和移动设备上（通过 Adob​​e AIR，例如在 Android 上）开发了 Flash 应用程序和游戏。

I am about to start developing a game (basic 2D platformer with pixelart graphics. Think about Super Mario World) targeted to both web and mobile platforms. Thus I'm searching for easy deployment to these two kinds of platforms, having basically the same source code.

我即将开始开发一款针对网络和移动平台的游戏（具有像素艺术图形的基本 2D 平台游戏。想想超级马里奥世界）。因此，我正在寻找易于部署到这两种平台，具有基本相同的源代码。

I'm divided between choosing ActionScript 3.0 (Flash) or HTML5/JavaScript for developing this game.

我在选择 ActionScript 3.0 (Flash) 或 HTML5/JavaScript 来开发这个游戏之间存在分歧。

My main question is, for those who've experienced the same situation before:

我的主要问题是，对于那些以前经历过同样情况的人：

What is the safest way to go?

最安全的出行方式是什么？

In other words, are there serious disadvantages with one of these frameworks that disallowsme to develop multiplatform 2D games?

换句话说，这些框架之一是否存在严重的缺点，不允许我开发多平台 2D 游戏？

Or am I just dreaming and practical multiplatform (web and mobile) game development is not so possible? (does someone know how Rovio did it with Angry Birds?)

或者我只是在做梦而实用的多平台（网络和移动）游戏开发不是那么可能吗？（有人知道 Rovio 是如何用 Angry Birds 做到的吗？）

---

---

Here are some pros and cons that I already know:

以下是我已经知道的一些优点和缺点：

Pros for AS3/Flash:

AS3/Flash 的优点：

• The state-of-art for web games.

• I'm experienced with it.

• (Almost) concealed source code.

• On the web, it's browser-independent.

• Can run as a "native" app on iOS and Android through Adobe AIR. It's not the best performance experience ever, but I know that you can get playableperformances with it.

• 网络游戏的最新技术。

• 我对此很有经验。

• （几乎）隐藏的源代码。

• 在网络上，它独立于浏览器。

• 可以通过 Adob​​e AIR 在 iOS 和 Android 上作为“本机”应用程序运行。这不是有史以来最好的表演体验，但我知道您可以通过它获得可玩的表演。

Cons for AS3/ Flash:

AS3/Flash 的缺点：

• Performance on AIR for mobile is not optimal, so I might end up having to abandon a really cool but expensive feature (or even several features).

• People are saying HTML5/Javascript will substitute it.

• AIR for mobile 的性能不是最佳的，所以我最终可能不得不放弃一个非常酷但昂贵的功能（甚至几个功能）。

• 人们说 HTML5/Javascript 将替代它。

Pros for HTML5/Javascript:

HTML5/Javascript 的优点：

• It's possible to do Flash-quality games using, e.g., engines like ImpactJSor Akihabara.

• Seems to be more stable and well supported on mobile in the future.

• Deployment as native app is possible through PhoneGap, appMobi, etc.

• 可以使用诸如ImpactJS或 Akihabara 之类的引擎来制作 Flash 质量的游戏。

• 未来在移动设备上似乎更稳定和更好的支持。

• 可以通过PhoneGap、 appMobi 等部署为本机应用程序。

Cons for HTML5/Javascript:

HTML5/Javascript 的缺点：

• I have some basic knowledge of this technology.

• Source code is wide open exposed.

• Performance/behaviour is browser-dependent.

• Lacks a solid framework or engine which is free of co$t$.

• 我对这项技术有一些基本的了解。

• 源代码是公开的。

• 性能/行为取决于浏览器。

• 缺乏没有成本的可靠框架或引擎。

采纳答案by André Staltz

I've decided to forget about HTML5 for cross-platform game development, and specially for deployment to mobile.

我决定忘记用于跨平台游戏开发的 HTML5，特别是用于部署到移动设备的 HTML5。

The cons I've pointed out for Flash are much lighter than the cons for HTML5. Basically, for the pixelart kind of games, Flash on mobile performs really well, specially if using some nice engine like Flixel.

我指出的 Flash 的缺点比 HTML5 的缺点要轻得多。基本上，对于像素艺术类型的游戏，Flash 在移动设备上的表现非常好，特别是如果使用一些不错的引擎，例如 Flixel。

For example, the Flixel game Robo Runhas great performance both on Androidand Flash Player in a browser. I don't have an iOS example for the same game, but I believe it would perform as good as on Android.

例如，Flixel 游戏Robo Run在浏览器中的Android和Flash Player上都具有出色的性能。我没有针对同一游戏的 iOS 示例，但我相信它的性能会与在 Android 上一样好。

Plus, Flash performance on mobile shouldn't be an increasing problem since the hardware on these devices just gets better and better.

此外，移动设备上的 Flash 性能不应该成为一个日益严重的问题，因为这些设备上的硬件只会变得越来越好。

After thinking about this HTML5 vs Flash issue for several months, I think there's no point adventuring in HTML5 cross-browser compatibility since Flash has proven to be a sort of Java for 2D games.

在考虑了几个月的 HTML5 与 Flash 问题之后，我认为在 HTML5 跨浏览器兼容性方面冒险是没有意义的，因为 Flash 已被证明是一种用于 2D 游戏的 Java。

回答by Plastic Sturgeon

I think you have outlined the pros and cons pretty effectively. If cross platform and mobile web development is your toppriority, Flash is a good choice. You will have all of the drawbacks you have identified.

我认为您已经非常有效地概述了利弊。如果跨平台和移动 Web 开发是您的首要任务，Flash 是一个不错的选择。您将拥有已确定的所有缺点。

If you use javascript/HTML such as the impact engine, you will have a different set of problems, and far less compatibilty on the web side.

如果您使用诸如影响引擎之类的 javascript/HTML，您将遇到一系列不同的问题，并且 Web 端的兼容性要低得多。

However, if having the game be the best it can be, you will need to look elsewhere, because as of the present, there is no code once publish anywhere solution.

但是，如果游戏是最好的，您将需要寻找其他地方，因为截至目前，没有代码一旦发布到任何地方的解决方案。

Unity 3D has good 3D and 2d mobile capabilities. Appcellerator may also be your cup of tea. http://www.appcelerator.com/

Unity 3D 具有良好的 3D 和 2d 移动功能。Appcellerator 也可能是您的一杯茶。 http://www.appcelerator.com/

But in the final analysis, nothing will beat making different versions for different platforms. in terms of performance, and being best suited to the device. Be sure to evaluate how well your chosen solution allows you to monetize your app as well. You'll likely be building multiple versions just to accomodate differences in revenue models and ad serving capabilities.

但归根结底，没有什么比为不同平台制作不同版本更好的了。在性能方面，最适合设备。请务必评估您选择的解决方案是否能让您的应用程序货币化。您可能会构建多个版本，以适应收入模型和广告服务功能的差异。

=== Update === In March of 2012 Adobe updated flash for iOS and Android to include support for OpenGL graphics, 3D and 2D graphics are now possible using flash as a single code base for iOS and Android. The speed is good, and you also can deply the same game to web. Its a great tool. The one drawback is that flash relies on "extensions" to connect to native OS capabilites such as Intents on android or Game Center on iOS. If you plan on using native capabilities extensively, look out for this as an obstacle to development.

=== 更新 === 2012 年 3 月，Adobe 更新了适用于 iOS 和 Android 的 Flash，包括对 OpenGL 图形的支持，现在可以使用 Flash 作为 iOS 和 Android 的单一代码库来支持 3D 和 2D 图形。速度不错，同样的游戏也可以发布到网页上。它是一个很棒的工具。一个缺点是 Flash 依赖于“扩展”来连接本地操作系统功能，例如 android 上的 Intent 或 iOS 上的游戏中心。如果您计划广泛使用本机功能，请将其视为开发的障碍。

回答by Plastic Sturgeon

As ScanPlayGames said, html5 sound is a big issue. There are some neat WebGL ports though. Dominic at Impact has been doing some amazing stuff. He's got the best framework out there.

正如 ScanPlayGames 所说，html5 声音是一个大问题。虽然有一些整洁的 WebGL 端口。Impact 的 Dominic 一直在做一些了不起的事情。他有最好的框架。

Rovio did a port using Google Web Toolkit for the chrome store.

Rovio 使用 Google Web Toolkit 为 chrome 商店做了一个移植。

I work for AppMobi. We've got a tool called DirectCanvas for iOS (Android will be coming soon) that increases the performance of games in the webview. One of our partners is developing a game that has the concept of Angry Birds (object A is propelled to destroy other objects). So Box2d support is there (the main thing holding us up from releasing). The performance is awesome, and the average joe doesn't know it's a webview game.

我为 AppMobi 工作。我们有一个名为 DirectCanvas for iOS（Android 即将推出）的工具，它可以提高 webview 中游戏的性能。我们的一个合作伙伴正在开发一款具有 Angry Birds 概念的游戏（推动物体 A 摧毁其他物体）。所以 Box2d 支持就在那里（阻碍我们发布的主要因素）。性能很赞，一般的joe都不知道是webview游戏。

And trust me, you wont' be wasting your time doing development on mobile first for desktop then. We've got some stuff up our sleeves.

相信我，您不会浪费时间先在移动设备上进行桌面开发。我们已经准备好了一些东西。

回答by bp74

I'm a Flash games developer too and did some research on how to migrate to HTML5. There are a lot of obstacles if you come from the Flash/ActionScript3 world. One of those things is JavaScript itself - i know many people like JavaScript, but if you are used to AS3 it is hard. Another thing is the problem with sounds (as mentioned above). The most important thing is that i don't want to start from scratch and i want to use my skills or even migrate code from the past.

我也是一名 Flash 游戏开发人员，对如何迁移到 HTML5 做了一些研究。如果您来自 Flash/ActionScript3 世界，则会遇到很多障碍。其中之一是 JavaScript 本身——我知道很多人喜欢 JavaScript，但如果你习惯了 AS3，那就很难了。另一件事是声音的问题（如上所述）。最重要的是我不想从头开始，我想使用我的技能，甚至从过去迁移代码。

To make a long story short i ended up with Googles new programming language called Dart. This language compiles to JavaScript in therefore runs on all modern browsers. The most important thing is that Dart is very similar to ActiontScript3! Then i did an open source library which provides all the Flash API you need for games (The Display List, Bitmaps, Sounds, ...) - i tried to make the library as compatible as possible with the Flash API to simplify the process of porting the source of a game. In the end it was pretty easy because you only need to change a few things.

长话短说，我最终使用了 Google 的新编程语言 Dart。这种语言编译成 JavaScript，因此可以在所有现代浏览器上运行。最重要的是，Dart 与 ActiontScript3 非常相似！然后我做了一个开源库，它提供了游戏所需的所有 Flash API（显示列表、位图、声音等） - 我试图使库尽可能与 Flash API 兼容以简化流程移植游戏源码。最后这很容易，因为你只需要改变一些东西。

The gamei have migrated: An ActionScriptto Dart comparison: Some other samples and the linkto the source:

我已迁移的游戏：ActionScript与 Dart 的比较：一些其他示例和源链接：

回答by Trio Cheung

I think a big disadvantage of Javascript is that it cannot detect picture's transparent regions so that it can stop reacting while mice hover or click on it. Since HTML5 was released, any new solution has been created?

我认为 Javascript 的一个很大的缺点是它无法检测图片的透明区域，因此当鼠标悬停或点击它时它可以停止反应。自从 HTML5 发布以来，有没有创建任何新的解决方案？

回答by Delete

I have worked with some people who did a very graphics intensive HTML5 application and the worst thing was doing the sound I remember...every browser had to be done differently. Go look for some open source html 5 game frameworks where people have already done the grunt work of testing across browsers...there are some pretty good ones I think. You dont want to have to be the one QA-ing across environments.

我曾与一些开发图形密集型 HTML5 应用程序的人一起工作，但最糟糕的事情是做我记得的声音……每个浏览器都必须做不同的事情。去寻找一些开源的 html 5 游戏框架，人​​们已经在这些框架中完成了跨浏览器测试的繁重工作……我认为有一些非常好的框架。您不想成为跨环境的 QA 人员。