1

将 CSS/JS 文件组合在一起是一种最佳做法,这样可以减少对站点的请求。但是,究竟如何做到这一点并非易事。三种极端策略:

  1. 不要结合任何东西。适合缓存,但对于没有缓存文件的用户来说会有很多 HTTP 请求。
  2. 将网站上的每个文件合并为一个。也适用于缓存,并且只有一个请求,但是文件会不必要地大,并且会包含很多不需要的东西,这会减慢浏览器的速度并可能导致冲突。
  3. 仅合并当前页面所需的文件。只有一个请求,没有不需要的内容,但是对于缓存来说太可怕了——如果你有 10 个文件,它们可以以一千种可能的组合出现,所以即使你的访问者看到了一个包含文件 1 和 2 的页面以及另一个包含文件 3 和 4 的页面,他们仍然需要为包含文件 1、2 和 3 的页面下载新的组合文件。(如果我们想保留文件的顺序,情况会变得更糟。)

理想的解决方案可能是这三种策略的组合(组合一些在很多页面上使用的文件并将它们包含在任何地方,并将其余的组合成几个文件,希望与在其他页面上的方式相同)页),但很难找到。您需要知道网站上使用了哪些文件,在哪个页面(或哪种类型的页面)上使用了哪个文件,每种页面类型获得了多少访问量,其中有多少来自回访者......简而言之,它手动操作似乎是一个巨大的痛苦。我在找

  • 理想情况下,足够智能的工具可以为您进行优化或提供帮助。
  • 更现实地,可以统计哪些 CSS/js 文件包含在哪个页面上/这些文件的下载频率/两个文件一起下载的频率的工具。
  • 如果没有好的工具,请提供有关如何手动执行的建议/策略/最佳实践
4

4 回答 4

1

以站点为中心的 CSS 和 JS 应该被最小化和组合。您绝对不想手动执行此操作,而是将其作为部署过程的一部分。本地更多的单个文件使开发/维护变得更容易。

以页面为中心的 CSS 和 JS 应该被最小化,但不能合并,因为它只适用于网站的一部分。(我认为以页面为中心的 CSS 甚至不应该是一个单独的文件,而是页面本身的一部分……当然,CSS 的全部意义在于避免以页面为中心的样式,所以可能没有实际意义)

而且,当然,总是有例外,并且高度依赖于项目的细节。

于 2012-05-16T17:00:32.180 回答
0

据我所知,css 和 js 文件不能与页面组合,因为它们大多被缓存并且比内容更不经常修改。

谷歌浏览器自带“开发者工具”(你在检查代码时看到的),它有很多很棒的功能。

审核菜单特别有用,因为它会为您提供优化建议,例如利用浏览器缓存、利用代理缓存、最小化 cookie 大小、优化样式和脚本的顺序、删除未使用的 CSS 规则等……看看吧!

于 2012-05-16T16:55:45.210 回答
0

国际海事组织你应该考虑合并的唯一事情是绝对存在于你网站的每个页面上的文件,以及你自己的自制资源。任何公共图书馆或类似的东西都不应该合并。缓存已经很容易击败“许多连接”的论点,并且随着时间的推移,服务器/浏览器在如何有效地缓存内容方面变得越来越智能。产生无数的重组只会让你无法从这一进步中获利。

于 2012-05-16T16:49:16.860 回答
0

另一种策略是将常用库(阅读:jQuery)移动到 CDN。据说客户端已经缓存了它的可能性更大。如果 cdn 文件不可用,可以提供自托管后备。

于 2012-05-16T17:25:39.837 回答