iPad网站优化

Question

我们公司为企业（网站）开发大型企业解决方案。在批准支持Apple iPad后，我们看到，我们的网站非常慢。因此，我的任务是通过优化GUI（Html，JS ......）来优化iPad的性能，因为应用程序的服务器部分非常快。 我找到了一些客户认可的解决方案技巧：
*减少网格列数，只留下最有用的 *关闭所有动画 *尽可能减少调整大小。
当然，我缩小了所有脚本和样式表 您能否为我提供一些如何提高绩效的建议？

Answer 1

有几件事情，其中​​很多都适用于桌面网站，而且它们只是良好实践的一部分。

没有特别的顺序：

• 删除额外的空格和HTML / CSS / JS注释
• GZip所有基于文本的内容（HTML，CSS，JS）
• 优化所有图片（例如，使用http://Smush.it等服务）
• 将您的图片/静态内容移至单独的服务器（增加的HTTP流水线），并且不在该服务器上提供Cookie
• 不要向他们不需要的“移动”提供任何东西（如果可能）
• 不要缩小客户端上的图像，从服务器提供缩小版本
• 由于大多数移动浏览器都能很好地处理CSS，因此请转换在表格中呈现的数据“列表”，以使用无序列表等。
• 从像谷歌这样的CDN中提供像jQuery这样的常见脚本
• 大多数移动浏览器支持某种脱机缓存或本地轻量级数据库 - 如果有任何可以缓存的内容以减少未来的负载，请考虑这样做
• 如果你想变得非常喜欢，你可以做一些事情，比如不直接加载图片......然后检查页面当前正在查看哪些图像（或稍微延迟），并根据需要加载它们......这方面的帮助很大程度上取决于内容
• 如果适用，请考虑延迟搜索结果的负载（例如，可能只加载前20个项目的Twitter流，然后只按需加载其他项目。

Answer 2

我想说的一些实际问题是：

1. 避免在您的网页上使用iframe。它们在iPad上运行不佳。
2. 使用像Sencha touch这样针对iPad进行了高度优化的库。
3. 使链接或按钮具有较大的密切区域，因为用户可能会因错误的链接点击而感到沮丧..
4. 避免使用CSS绝对定位元素。

还要添加几点;

1. 最好将元视口设置用作width = device-width ...这样可以确保您的视口是根据您的设备设置的，而不是硬编码。
2. 避免使用CSS：iPad CSS中的悬停属性......它们可能会导致不必要的问题（虚假悬停）