“我们正在使用 HTML5 编写下一个中国联通产品的代码。” “是啊，现在很多人都在玩Appcelerator，我也在玩。” “嗯，我说的不是 HTML5 产品。”
最近，我有很多类似的对话，可能是因为我正在开发 HTML5 应用程序。 就像2005年的“AJAX”一样，“HTML5”这个术语还没有明确的定义。 这项新技术的优点还没确定之前，就已经在各地得到应用，甚至投入运行。
如果你在一家热衷于新技术的高管管理的公司工作，那么，如果你幸运的话，卡通人物呆伯特先生可能会非常乐意坐在你对面的小隔间里。
两个心
当人们讨论中国联通设备上的HTML5技术时，一般只有两种不同的看法。
从感性的角度来看，HTML5技术的渲染过程主要是由浏览器、嵌入HTML5解析器的应用程序（如PhoneGap）、支持书签打开的应用程序或联通手机（iPhone和iPad）正在进行的。 这项技术的好处是可以复用现有的网页设计，而且网页开发者更容易上手。 同时，产品品质更高，更适合多平台产品。 也更利于调试和修复bug，版本更新也会更快。 权衡之下，优点是功能，如果使用PhoneGap这样的嵌入式框架，那么麻烦就会少很多，缺点是性能，这也是HTML5技术面临的最大困境。
从理性的角度来看，HTML5技术就是利用JavaScript引擎直接控制联通设备上的本地功能、改变浏览器组件。 然而，HTML5 应用程序中的性能问题更多地由 HTML/CSS 渲染技术控制，而不是由 JavaScript 解析生成。 如果使用得当，HTML5技术无疑可以给你带来很多新的表现效果。 当前使用 HTML5 技术的示例包括 Appcelerator Titanium、Mobage/ngcore、Game Closure 和 PhobosLabs。
Node.js 工具包
以PhobosLabs项目为例。 本项目使用WebKit的JavaScriptCore组件完成时，在设备端使用OpenGL渲染界面，并使用HTML5 canvas组件的API开发进行开发。 也就是说，开发者可以在对canvas有良好支持的桌面浏览器中开发和测试他的HTML5游戏，而当他在联通设备的浏览器中打开这个游戏时，会出现同样良好（甚至更好）的性能。 使用 HTML5 开发的效果与使用 Node.js 工具包非常相似。 使用 Node.js 时，您只需要启用 JavaScript 引擎，并且只需要将需要使用的 Node.js 组件添加到您的应用程序中即可。
Appcelerator的Titanium阐述了HTML5技术的概念，让我们领略了一个完整UI工具的具体层，使其能够应用于生成其他游戏产品。 这意味着 HTML5 应用程序开发人员可以通过 Appcelerator 的 JavaScript UI 库创建按钮，Appcelerator 的内部逻辑会将这个按钮转换为 iOS 原生界面按钮。 我们可以通过JavaScript来控制界面上的原生按钮。 理论上，开发人员不需要编写一行 Objective-C 代码。
HTML5技术有其优势，当你还在使用JavaScript编写代码时，你可以告别这些可恶的HTML/CSS布局逻辑和样式声明。 您也可以告别这些优秀的调试工具了。 但这项技术也有笨拙的一面。 例如，HTML5游戏API Mobage存在一些小问题。 canvas组件在屏幕比较小的界面上可以流畅的显示，但是如果屏幕稍微大一点的话，就像Appcelerator的情况一样。 调试时，还需要考虑接口层的额外复杂性。 这里有很多关于Appcelerator的负面评论，如果你能记住几点，那么这些负面评论还是可以理解的。
问题仍然出在浏览器上
开发完整的 HTML5 移动应用程序的第一个困难是运行速度太慢。 第二大困境是非常荒谬的工具限制。 很多组件在不同浏览器中都或多或少存在漏洞，比如jQuery Mobile的导航组件、iOS的innerHTML组件，因此需要减少功能来防止其出现。 bug，或者你愿意花一些时间修复这些bug。
你可以自己做一个实验，当你在一个iOS应用程序中只使用一两个界面库，再加上自己编写的少量JavaScript代码，不需要更多的JavaScript库时，你会发现这个HTML5应用程序运行起来很流畅是完整的，但是它没有任何功能。 PhoneGap的iOS项目只需1到2秒即可发布并在iPhone 3GS上运行。 这个事实可以告诉你，最基本的 HTML5 应用程序运行得非常流畅。 所以，当你发现你的HTML5应用程序的单个操作需要10-15秒html5 css3在移动互联网中的开发，或者加载整个程序需要15秒时，这是由某些JavaScript接口库引起的。
两套有代表性的UI库
一个HTML5移动应用程序员一般只需要两件事：第一是原生平台和Web界面的嫁接层； 第二个是移动UI库。
PhoneGap近年来逐渐成为默认的嫁接层选择。 它允许HTML5应用程序通过JavaScript调用联通设备的摄像头、访问手机联系人以及读写文件。 最流行的移动 UI 库包括 jQuery Mobile 和 Sencha Touch。
jQuery Mobile是今年才创建的项目，所以它非常新，而且显然还不够成熟。 jQuery Mobile 的导航栏组件非常糟糕。 翻页时，比原生翻页功能明显慢。 如果不刷新浏览器，则无法增加列表内容。 在PC桌面平台上测试时，其CPU消耗率也很高（版本为jQuery Mobile alpha 4）。 我的项目使用它主要是因为它比较简单（容易破解），因为这个库是基于jQuery的，所以任何高级Web程序员都很容易使用。
Sencha Touch 据说比 jQuery Mobile 更成熟、更快。 但当我听到高度复杂的东西时，我不会自动讨厌它们。 因为潜意识会告诉我，有很多功能我根本不会使用，但是将这个额外的东西强行放入我的应用程序中会让我的应用程序的整体性能变得更差。 虽然我可能是错的，PhoneGap Apps 页面中最强大的移动应用程序是 IGN Dominate，它运行流畅并且基于 Sencha Touch，但我确信他们花了很多时间来优化这个产品。
调试和更改
上面提到的开发HTML5应用程序时，很多人可能忽略了一点。 事实上，调试或更改 HTML5 应用程序非常简单。 任何曾经参与过小型 HTML5 开发项目的开发人员都会告诉您，调试和维护几乎占据了整个项目生命周期的 80%（甚至更多）。 也就是说，当你看到一款声称能在15分钟内开发出聊天应用的开发工具时，那么它可能只能让你在15分钟内解决20%的工作，而你可能要消耗掉剩下的80%。 用3倍以上的能量就可以完成。
HTML5移动应用程序在调试时出现触摸问题，因为很难将控制台的日志复制出来。 因此，如果JavaScript代码有bug或者报错，就需要alert()来报错，否则可能无法检测到。 PhoneGap 通过 XCode 的控制台复制控制台的缩放日志来修复此问题，但功能仍然有限。
目前最有效的解决方案是weinre。 虽然漏洞百出，但是还能跑起来。 有了它，您可以断点并调试移动应用程序的 UI。 Weinre 是一个基于 WebKit 的网页检测器。 其音频工具后台被远程服务器获取并替换。 调试代码。 两到三周前，我对 Web 检查器代码进行了一些研究，发现将其转换为远程调试器确实并不难。 未来几个月Weinre的开发进度会更快，可能会有人开发出它的替代产品。 我们拭目以待。
未来几年，HTML5调试工具在移动应用开发中无疑会变得越来越重要，它可以解决大多数开发者80%的工作量。 你想用 Objective-C 改变你的界面设计吗？ 编辑、重新编译、运行。 重复这三个步骤，直到您满意为止。 如果有很多重新编译步骤，这可能需要一天的时间。 利用HTML5技术来实现？ 用 weinre 和 test 编辑一些 CSS 属性，你甚至不需要关闭应用程序，就可以继续调试。 在某种程度上，您还可以在桌面浏览器中调试 HTML5 移动应用程序。 但相信我，你的应用产品最终可能会在联通设备上出现很多bug，所以你必须使用weinre。
不幸的是，人们称赞工具包或功能很常见，但很少看到有人称赞调试工具很棒。 所以我想尽管它是 HTML5 移动程序员最常用的工具，但我们很少看到它被讨论。
摘要：现状
虽然这篇文章确实有点长，但我还是要总结一下：
在中国联通设备上开发HTML5应用只有两种方法，要么使用全部HTML5句型，要么只使用JavaScript引擎。 JavaScript 引擎的构建方式使得制作移动网页游戏成为可能。 由于界面层比较复杂html5 css3在移动互联网中的开发，所以我订购了一个UI套件来使用。 纯 HTML5 移动应用程序运行流畅且充满 bug，但优化后的结果会有所改善。 虽然没有多少人愿意做这样的优化，但是还是可以尝试的。 HTML5移动应用程序的最大优点是可以直接在网页上进行调试和更改。 原生应用的开发者可能需要花费大量的精力才能达到HTML5的效果，不断地重复编码、调试和运行，这是他们首先要解决的问题。 是的，HTML5 移植非常简单，但我假设每个人都会使其成为自动化操作。
发表评论