javascript - 压缩脚本和样式并将所有 js 和样式引用组合成单个引用以优化站点性能

Question

我的 asp 站点中有多个脚本和样式引用。当我观察我的站点网络实例时，它正在执行 46 个请求，这确实太多了，并且极大地影响了我的站点性能。由于我在一个页面中引用了多个脚本和样式，因此导致了过多的 http 调用。现在我想压缩 gzip 中的所有脚本和样式，然后将多个脚本组合到一个脚本引用中，将多个样式组合到一个样式引用中。

<link type="text/css" rel="stylesheet" href="/css/main.css" />
<link type="text/css" rel="stylesheet" href="/css/style1.css" />
<link type="text/css" rel="stylesheet" href="/css/style2.css" />

<script type="text/javascript" src="/scripts/js/js1.js"></script>
<script type="text/javascript" src="/scripts/js/search/jsSerach.js"></script>
<script type="text/javascript" src="/scripts/js/cust/jsCust.js"></script>

当我将测试代码移至生产环境时，我想要什么我想压缩所有三种样式引用，然后将它们组合成单个引用，如 ma​​sterStyle 类似地用于所有 js 引用。

为了实现这一点，我喜欢一个不错的工具 YUI tool ，但我对如何使用它感到很困惑，并且还认为我必须用新的组合引用替换各个页面中特定样式或脚本的引用，我认为这可能有些风险。任何人都可以建议我应该如何进行。提前致谢。

Answer 1

我用过 Client Dependency Framework为了同样的目标，取得了很大的成功。由于 CDF 的主要功能是管理客户端依赖性，它还将提供附加值，允许您在所有代码中自由包含客户端脚本，并且 CDF 将在需要时仅包含一次。