构建 HTML5 移动应用程序的推荐方法是啥？ [关闭]

Posted 2023-02-26

【中文标题】构建 HTML5 移动应用程序的推荐方法是啥？ [关闭]

【英文标题】：What's a recommended way to build a HTML5 mobile app? [closed]构建 HTML5 移动应用程序的推荐方法是什么？ [关闭]

【发布时间】：2011-09-22 15:35:41

【问题描述】：

虽然我们是这项技术的新手，但我们现在正在使用 sencha-touch 和其他一些 js 库（如 i18n）开发 html5 移动应用程序。

问题在于：

无论我们如何尝试调整性能，都感觉有点慢。 每次我们切换到另一个页面时，当浏览器加载下一页时，都会出现一个丑陋的空白页间隔。

我们认为我们可能会错过一些 HTML5 移动应用的结构性和最佳实践。我们推测我们仍在使用我们的网络逻辑处理 HTML5 移动应用程序。

这就是我想问的原因：

除了 sencha-touch 以外的其他 js 可以加吗？是不是在这里拖了速度？ 多页移动应用程序是一种好习惯吗？还是应该在同一个 html 页面中构建所有内容？ 有没有办法预先加载所有内容，以便更快地更改页面？

谢谢

【问题讨论】：

无论你尝试什么框架，它总是会让人感觉缓慢/笨拙。您应该放弃 HTML5 并采用原生方式。

【参考方案1】：

Sencha touch 有很好的表现，而且他们承诺在即将到来的（10 月 26 日左右）sencha touch 2 中会有更好的表现（http://www.sencha.com/blog/sencha-touch-2-what-to-expect ）。所以 sencha touch 作为 JS 库进行了很好的优化。也许您的应用程序没有得到很好的优化，或者其他东西正在减慢它的速度。总而言之，我的观点是，作为 JS 库的 sencha touch 可以说是 JS 库所能达到的一样好，所以这根本不是问题。

所有 JS 应用程序都应该是一页 HTML。有一些方法可以维护浏览器历史记录和状态，如果这是您关心的问题。

有几种方法可以预加载和缓存所有内容，但如果您使用单页 HTML Web 应用程序，那么您实际上不必这样做。

所以我的建议是坚持使用 sencha touch，至少在 sencha touch 2 推出之前，看看性能问题是否得到解决，然后再转向其他解决方案。此外，您需要做的第一件事是使其成为一个单一的 HTML 页面应用程序，并进行一些测试和测量以了解是什么导致应用程序变慢。

【讨论】：

谢谢 Ilya139。您通常如何进行性能测试以了解是什么导致您的应用变慢？

另外，关于移动应用的文件结构，你有什么推荐的读物吗？

要测试您的应用程序的性能，您可以使用 jsperf.com 和 www.broofa.com/Tools/JSLitmus/ 等工具，或者只是将执行某些功能所需的时间输出到控制台 (@987654323 @)。此外，chromes 开发者工具的时间线可以方便地查看渲染需要多少时间，内存等。总而言之，有很多工具，但最重要的是了解您的代码并从用户的角度查看看起来很慢的地方。

对于移动应用程序的结构，我推荐 MVC 模式。在此处查看有关它和煎茶的教程：sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap 和此处vimeo.com/28219285

【参考方案2】：

我个人使用 JQuery Mobile。

http://jquerymobile.com/

框架确实需要一些时间来理解。它的完整版应该在本月或下月初发布。自 Alpha 以来我一直在使用它。如果您熟悉 JQuery，我强烈推荐它。他们正在处理一些非常简单的事情，例如每部手机之间的不同差异。

这是一个支持平台列表： http://jquerymobile.com/gbs/

它是 ajax 驱动的，但是这个功能可以关闭。它可能有点重，但考虑到在每部手机上处理这么多奇怪的事情所做的工作量，我认为它真的值得学习。我建议您查看文档和演示，看看这是否是您要查找的内容。

http://jquerymobile.com/demos/1.0b3/

如果您对此有任何具体问题，请随时提出。