【发布时间】：2010-12-17 04:46:14
【问题描述】：
前几天我发现了这个小软件——WARI。它代表 Web 应用程序资源检查器。显然，它检查 css、html、js 和图像之间的依赖关系，并报告未使用和重复的 css 样式、javascript 函数和图像。
你用什么？有其他选择吗？
【问题讨论】：
标签： java javascript html css
【发布时间】：2010-12-17 04:46:14
【问题描述】：
如果您的目标是加快页面加载时间，WARI 似乎肯定会帮助您减少加载页面所需的数据。
不过，我建议你更进一步——采取Yahoo!'s advice 和minimize the number of HTTP requests：
- 组合文件是一种减少 HTTP 请求数量的方法，方法是将所有脚本组合成一个脚本，类似地将所有 CSS 组合成一个样式表。当脚本和样式表因页面而异时，合并文件更具挑战性，但将这部分作为发布过程的一部分可以缩短响应时间。
- CSS Sprites 是减少图像请求数量的首选方法。将您的背景图片组合成一张图片，并使用 CSS background-image 和 background-position 属性来显示所需的图片片段。
- 内嵌图片使用
data:URL 方案将图片数据嵌入到实际页面中。这会增加 HTML 文档的大小。将内联图像组合到（缓存的）样式表中是一种减少 HTTP 请求并避免增加页面大小的方法。并非所有主流浏览器都支持内嵌图片。
【讨论】：
正如 Stat1124 所说，Firebug 是无价的。网络面板非常适合此用途，因为它显示了加载与页面关联的所有资产所需的时间 - 如果资源不可用，它还会显示 HTTP 响应代码。
在尝试优化网站时，yslow (http://developer.yahoo.com/yslow/) 是对 firebug 的一个很好的补充 - 因为它提供了具体的实施技巧来实现更灵敏的页面加载。
还有一个很棒的实用程序，称为 smush.it (http://developer.yahoo.com/yslow/smushit/) - 最近已添加到 yslow 工具包中 - 可产生优化以减小图像大小。
【讨论】：
如果您是 Firefox 粉丝，我碰巧使用了 Firebug 插件，它提供了万事通的 Web 开发工具包。我可能会夸大一点，但我发现它非常有用。这里有一个简短的说明：Firebug 与 Firefox 集成，在您浏览时将大量的 Web 开发工具放在您的指尖。您可以在任何网页中实时编辑、调试和监控 CSS、HTML 和 JavaScript
如果您想了解更多信息，可以在这里查看他们的主页：Firebug
【讨论】：
你可以试试Google´s page speed
这样您就可以检查有关您网站的所有相关信息。哪些 CSS 未使用，Google 页面速度会缩小您的 JS 文件等等。看看吧，你会印象深刻的。 :-)
【讨论】：
从概念上讲，这样的工具非常方便，因为查找杂散文件并安全删除它们通常是一项非常尴尬的任务。
我不确定是否是这种情况......但从这个问题的措辞看来，这可能是一个自我推销的问题，而不是一个认可的活动。如果您想用您自己的答案跟进通用问题“有哪些工具可以执行 x、y 和 z”，那很好。
为了记录，我使用了 2 个名为 CheckWeb 和 Xenu 的工具，它们将跟踪所有链接并报告找到的内容。
这会找到任何 404，然后我将引用文件列表与我的目录列表进行比较，以查看哪些文件未使用。 （它很粗糙，但很有效）
【讨论】：