【问题标题】:How can I code an efficient mobile site like gmail's?如何编写像 gmail 这样的高效移动网站?
【发布时间】:2011-02-22 12:15:32
【问题描述】:

我的网站有一个适用于 iPhone/Android 设备的不同移动版本。然而,问题似乎出在网站的性能上。即使我没有加载任何图像,它也确实很慢而且很重。

另一方面,当我使用 Gmail 或 YouTube 的移动版本时,它们的速度非常快,几乎就像原生移动应用程序一样。

他们是怎么做到的?

非常感谢您的帮助:)

【问题讨论】:

  • 移动版是完全不同的应用程序,还是同一个桌面网站但提供不同的样式表?看看有多少http请求。你说没有图片,但是 javascript 和 css 以及字体等其他资源呢?

标签: mobile-website


【解决方案1】:

看我的评论。此外,如果您在与网站交互时感觉到缓慢,则可能是它缺乏接受触摸事件的能力。在移动网络上,如果您没有为 js 触摸事件连接 UI,体验会显得更慢,因为设备浏览器必须回退到标准点击和其他不是最佳的鼠标事件。 mootools 和 jquerymobile/jqtouch 等框架已经内置了这些事件。看看 mootools 解决方案,它写得很好:http://davidwalsh.name/mootools-touch

【讨论】:

    【解决方案2】:

    他们可能会使用本地存储http://dev.w3.org/html5/webstorage/ 您的页面是否太大?尝试使用 gzip 和/或减少输出 您的服务器的连接速度也可能是缓慢的原因

    【讨论】:

      【解决方案3】:

      好吧,您不需要包含任何 javascript 框架来使其快速可点击。

      通过实现一些 JavaScript,您可以实现这一点。 Google 已经为此发布了解决方案

      https://developers.google.com/mobile/articles/fast_buttons

      这将允许访问者以原生方式与应用程序交互。从 Android 4(据我所知)版本开始,通过设置视口元标记,浏览器将自动应用快速点击功能。

      对于动画问题,请始终使用硬件加速动画,并回退旧版移动浏览器。使用硬件加速动画,它会让您的应用程序流畅如丝。

      遵循本指南,您可以使您的应用程序与 gmail / youtube 移动版一样快。

      http://www.html5rocks.com/en/tutorials/speed/html5/

      祝你好运。

      【讨论】:

        【解决方案4】:

        您的 web 应用程序消耗了过多的 RAM。不要使用太多的库,也不要附加太多的事件处理程序。

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2010-12-04
          • 2022-11-14
          • 1970-01-01
          • 2013-01-22
          • 1970-01-01
          • 1970-01-01
          • 2011-01-30
          相关资源
          最近更新 更多