移动网页尺寸
我有一位开发人员设计了一个通过手机浏览器在手机上使用的金融应用程序。现在每个页面有 150kb，我认为这太大了。没有使用图像，因为它主要是 HTML 按钮和 CSS，可能还有 JavaScript。 如何最小化页面大小？
I have a developer designing a financial application to be used on a mobile phone via the phones browser. Now each page is 150kb which to my opinion is way to large. No images are used as it is mostly HTML buttons and CSS and possibly JavaScript.
How can I minimize the page size?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
缩小你的js/css/html。如果没有帮助，您将需要重组页面以显示更少的信息，正如您所说，没有图像，因此您无法在这方面进行任何优化
minify your js/css/html. If is doesnt help, you will need to restructure your pages to show less info, as you said there are no images, so you cant do any optimization on that front
如果尚未完成，请在您的服务器上启用 HTML 压缩。
您的目标手机上有哪些软件？如果他们有功能强大的浏览器，您可以通过以 JSON 形式发送相关数据，然后让 Javascript 呈现相关 HTML 来减轻重量。如果我们谈论移动 IE...也许，也许不是。
并且，正如其他人所说，使用缩小。
在更高的层面上，您确定每页需要这么多数据吗？在移动浏览器上导航会很痛苦。
Enable HTML compression on your servers if it's not already done.
What software are on your target phones? If they have capable browsers, you could cut some weight by sending the relevant data down in JSON form and then having Javascript render the relevant HTML. If we're talking Mobile IE... maybe, maybe not.
And, as others have said, use minification.
At a higher level, are you sure you need this much data per page? On a mobile browser it's going to be a pain to navigate.
主要内容已经说过了，但我想补充一点：
清理 Html 标记。检查是否有不必要的嵌套标签、div 等。当 DOM 更轻时，它还可以帮助 javascript 更快地处理。
The major things have been said already but I would add this :
Clean up the Html markup. Check that there are no unnecessary nested tags, divs, and so on. It also helps the javascript to process faster when the DOM is lighter.
这是我目前正在解决的问题，我可以告诉你，你绝对会喜欢这本书
在本书中你会发现的第一件事是你应该减少 HTTP 请求，而做到这一点的方法之一就是将图像放入所谓的“精灵”中（尽管你说你的设计师并没有使用很多图像，它仍然有助于将少量图像推送到精灵）。
为此，您需要一些工具（因为手动执行只是浪费时间），为此我使用了 compass ，而SASS实用指南这本书绝对是非常适合这个主题（它开门见山，展示了如何使用指南针来制作精灵 - 另外，我敢打赌，一旦你尝试了 SASS，你将永远不会回到普通的 css）。
另外，正如 Midhat 提到的，你应该缩小你的 js/css/html，但最重要的是，你应该将所有 js 文件放入一个文件（减少浏览器必须发出的 HTTP 请求），将所有 css 代码放入一个 css文件。另外，您应该将样式表放在页面顶部，将脚本放在底部。无论如何，我列出的几件事以及总共 14 条规则您都可以在 Steve 的书中找到。所以尝试一下吧，你不会失望的。
This is the problem I'm currently tackling, and I can tell you that you will absolutelly love the book High Performance Web Sites by Steve Souders.
The first thing you'll find out in the book is that you should make fewer HTTP requests and one of the ways to do that is to put images in so called "sprites" (although you said your designer doesn't use a lot of images, it would still help to push that few images to sprites).
To do that you would need some tool (cause doing it manually is just a waste of time), and for this I used compass, and the book Pragmatic guide to SASS was absolutelly great for this topic (it goes straight to the point and shows how to use compass to make sprites - also, I bet once you try SASS, you will never go back to vanilla css).
Also, as Midhat mentioned you should minify your js/css/html, but on top of that you should put all your js file to one file (cutting down on HTTP requests the browser has to make), all your css code to one css file. Also, you should put the stylesheets at the top of the page, and scripts at the bottom. Anyways the few things I listed and a total of 14 rules you'll find in Steve's book. so give it a try, you won't be dissapointed.