2010-10-18 95 views
1

我有兴趣了解通过在单个压缩文件中发送不同类型的内容来减少服务器上的http请求的可能性,然后在客户端的浏览器上解压并放置这些东西(图像,css, js)它应该在哪里。在客户端浏览器中解压缩内容

我在某处读到firefox正在制定计划,在未来的版本中提供这些功能,但尚未完成,再加上它不会是标准版本。

你们会为此提出任何解决方案吗?Flash可以用来解压缩客户端上的压缩文件以备后用吗?

感谢

回答

2

我们做了或多或少的事情,你在我们的网站上描述的是非常高兴的响应时间。

原始文件全部是分开的(HTML,CSS,JS,图像),我们开发它们。
然后移动到生产的时候,我们有一个shell脚本:

  • 使用YUI压缩机压缩CSS和JS
  • 所有图像被读取并转换为data:image/png;base64,...
  • 所有的空格和注释从去除在HTML
  • 所有这些资源都在HTML

页放在内联是〜300KB,通常缓存。
服务器gzip它,网络的实际大小然后更低。
我们不使用任何额外的压缩。

然后有第二个调用来获取数据(我们的JSON),并开始渲染它的客户端。

+0

并且你正在使用DOM方法为HTML呈现或设置创建节点innerHTML的? – Volatil3 2010-10-18 15:58:28

+1

我们使用http://beebole.com/pure来呈现HTML中的所有JSON。 PURE使用'innerHTML'。我首先尝试了DOM,但速度非常慢,而所有浏览器上的“innerHTML”都很快。这在移动浏览器上尤其引人注目。 – Mic 2010-10-18 17:06:08

+0

和base64编码是在运行时完成的,还是所有图像都以编码形式转换? – Volatil3 2010-10-19 15:47:42

2

我不得不读你的问题我有你问的是什么之前几次。这听起来像你想基本上把你网站的所有元素组合成一个可下载的文件。

我相当有信心说我不相信这是可能的或可取的。

首先,您声明您已经听说Firefox可能会支持此操作。我还没有听说过,但即使他们这样做了,您仍然可以在支持其他浏览器的情况下使用该功能吗?

但即使你可以做到这一点,你已经标记为“性能调优”,理由是你将保存一些http请求。但是为了节省http请求以加快速度,您需要谨慎行事,以免实际上最终放慢速度。

将所有文件合并可能会将您减少为一个http请求,但是您的站点可能会加载速度较慢,因为整个事件在加载之前需要加载才能显示(与正常页面加载相反您的页面加载可能需要一段时间,但其中至少有一部分可能已经准备好可以很快显示)。

你现在可以做什么以及哪些可以用来减少http请求,是将你的样式表合并成一个CSS文件,将你的脚本合并成一个JS文件,并将相关图像合并成单个图像文件(google CSS Sprites有关此技术的更多信息)。即使这样,你需要小心你结合了哪些文件 - exersise的要点是减少http请求,所以你需要利用缓存,否则你最终会让事情变得更糟而不是更好。浏览器只能缓存多个页面上相同的文件,因此您应该只合并页面加载之间不会更改的文件。因此,例如,只能将您网站上所有页面正在使用的Javascript文件合并在一起。

我最后的评论是重新进行我已经说过的内容:对过度优化保持谨慎,以至于实际上最终会放慢速度。

+0

我不同意你所捍卫的不可能性和可取性。我们在我们的网络应用程序上执行它,不要后悔。 – Mic 2010-10-18 09:44:02

+0

@Mic:如果你用外部世界来详细说明你的实现将会很有趣 – Volatil3 2010-10-18 09:52:38

+0

查看演示http://beebole-apps.com?demo – Mic 2010-10-18 10:00:06