移动网页大小

Question

我有一位开发者设计了一个通过手机浏览器在手机上使用的金融应用程序。现在每个页面都是150kb，这对我来说意义重大。没有使用图像，因为它主要是HTML按钮和CSS以及可能的JavaScript。 如何最小化页面大小？

Answer 1

minify你的js/css/html。如果没有帮助，则需要重构页面以显示较少信息，因为您说没有图像，所以您无法在该前端进行任何优化

Answer 2

如果服务器尚未完成HTML压缩，请启用HTML压缩。

目标手机上有哪些软件？如果他们有能力的浏览器，那么可以通过以JSON形式发送相关数据然后让Javascript呈现相关的HTML来减轻一些重量。如果我们正在谈论移动IE ...也许，也许不是。

而且，正如其他人所说，使用缩小。

在更高的层面上，你确定你每页都需要这么多的数据吗？在移动浏览器上导航会很麻烦。

Answer 3

主要的事情已经说过了，但我会补充一点：
清理Html标记。检查是否没有不必要的嵌套标签，div等。当DOM更轻时，它还可以帮助JavaScript更快地处理。

Answer 4

这是我目前正在处理的问题，我可以告诉你，你绝对会喜欢Steve Souders的书High Performance Web Sites。

你会在书中发现的第一件事是，你应该减少HTTP请求，并且这样做的一种方法是将图像置于所谓的“sprites”中（尽管你说你的设计师没有使用大量的图像，它仍然有助于推动那几个图像精灵）。

要做到这一点，你将需要一些工具（事业做手工只是浪费时间），为此我用compass，这本书Pragmatic guide to SASS是为这个话题absolutelly很大（它会开门见山，并展示了如何使用罗盘制作精灵 - 另外，我敢打赌，一旦你尝试SASS，你将永远不会回到香草的CSS）。另外，正如Midhat提到你应该缩小你的js/css/html，但最重要的是你应该把所有的js文件放到一个文件中（减少浏览器必须做的HTTP请求），所有的css代码到一个CSS文件。另外，您应该将样式表放在页面顶部，脚本放在底部。无论如何，我列出的几件事，以及史蒂夫书中总共14条规则。所以试试吧，你不会失望的。