【优化工具】网站性能优化工具大全 - Web前端

网站性能优化（WPO）已经成为一个非常重要的话题了，越来越多的互联网公司开始有WPO的职位，而相关技能也是对前端开发工程师的重要技术要求之一。国外大牛Steve Souders在参加WebPerfDays London期间，收集了大量常用的网站性能优化工具，这里和大家分享下。

常用的网站性能优化工具：

WebPagetest
Cuzillion
Chrome Dev Tools
Speed Tracer
Performance Analyzer (收费)
SPOF-O-Matic, 3PO for YSlow
Wireshark
PageSpeed, YSlow
dynaTrace Ajax Edition 和 SpeedoftheWeb
HTTP Archive
关键路径浏览—— PageSpeed Insights的一部分
PhantomJS
移动设备同步调试：Weinre, jsconsole.com, Opera Dragonfly, Chrome for Android
Apache Bench (ab)
Show Slow
Browserscope
Tilt, DOM Monster
Mobileperf Bookmarklet
chrome://net-internals
Redbot
SpriteMe
Boomerang, Episodes
wget, telnet
Wappalyzer
Netalyzer
Shunra NetworkCatcher Express
Packet Flight
Fiddler, Charles
CSS Lint, JSLint
GTMetrix
Torbit Insight
Grunt.js
sitespeed.io
SSL Server Test
SPDY 指示器 (Firefox, Chrome), SPDYCheck.org
KITE, MITE
Compass (CSS)
Soke, Seige, Tsung (加载测试)
SpeedCheckr
当然这些不是全部，还有很多工具是目前所缺少的：
当分析一个网站时需要一个计算last-modified时间和今天之间的平均变化并和过期时间来对比的工具。目的是告诉开发者过期时间和资源变化频率是否一致。这个功能可以和PageSpeed、YSlow和http Archive整合。

检测一个网站是否在可以使用同步片段(async snippet)的时候使用阻塞的片段(blocking snippet)。比如Pagaspeed实现了但是只能用于Google Analytics。

诊断渲染被延迟的根本原因的工具。

更容易的可视的dns TTLs的工具，内置到Chrome Dev Tools或者WebPagetest。

爬去文件目录并优化图片的后端工具。候选： Yeoman, Wesley.

Safari(mobile)中的导航计时。

更好的检测和诊断内存泄露的工具。

网页计时规范，计算javascript、css、reflow等环节花费的时间。

可视、可修改网络存储(localStorage、APPCAChe等)的工具。

可视、可清理DNS缓存的工具。

专注于性能建议的JSLint版本。

对比两个HAR文件的工具。

总结：

网站性能优化除了雅虎的34条黄金准则之外，分析和优化工具是必备的，希望这些工具能够对大家有所帮助。但是性能优化并不仅仅这些，还有很多技术是实践中积累发现的，比如元彦同学最近整理的几篇：
【高性能前端1】高性能HTML
【高性能前端2】高性能CSS
【高性能前端3】高性能JavaScript
【高性能前端4】Appcache Facts 中译版