Web性能优化（工具篇）

2019独角兽企业重金招聘Python工程师标准>>>

#####CDN

• CloudFlare——可以成为你的DNS服务器
• MaxCDN——可无缝地融合WordPres和W3的所有缓存资源。
• CloudFront——亚马逊网络服务（AWS）版本的CDN
• CDNperf——可以帮你找出最快和最可信赖的JavaScript CDNS，让你的网站更快更有朝气

#####性能测试

• WebPagetest——性能测试的黄金标准,通过API wrapper，也可以将WebPagetest的相关服务添加到NPM模块和命令行工具中。
  • webpagetest-mapper：将WebPageTest的测试数据转换为可读的文档格式。
  • WPT Bulk Tester：使用Google Docs测试多个URLs（如果有多个API key，也可以用webpagetest.org来做这件事）。
• Yslow——基于Yahoo的高性能网页教条。
• Google PageSpeed——根据网页最佳实践分析和优化测试的网页。
• Pingdom网站速度测试
• SpeedCurve——追踪网站性能表现
• Calibre——追踪页面的加载时间，以及页面的大小和问题页面。
• GT Metrix——结合料Google PageSpeed和YSlow
• perf.js——开发过程中，将性能的时序情况显示在页面上
• perf bar——快速收集和查看网页性能，提供预置或自定义的量化标准
• grunt-prefbudget——用于评估性能的Grunt task
• Sitespeed——给予最佳实践以及一些加载时序等量化标准的开源工具。
• speedgun——使用Speedgun.js收集任意公开站点的性能数据。
• gulp size——显示项目大小

#####浏览器插件 Page performance——快速分析当前页面的性能。

#####审查

• PerfAudit——审查页面的加载和渲染性能
• Perfmonkey——让追踪页面的渲染性能变得无比简单

#####SVG和图片

• ImageOptim——免费的减少图片体积，提高加载速度，但不牺牲质量，可集成到Grunt和Gulp中。
• SVG Optimizer——基于Node.js的SVG矢量图形优化工具。
• SVGO's Missing GUI——揭露SVG文件的主要问题
• 手动优化SVGs
• Triamge——跨平台的GUI和CLI工具，优化网站图片

#####CSS

• CSS Triggers——展示哪些CSS属性可以影响浏览器的布局、渲染和其它组合操作。
• CSS Stats——以可视化的形式展示了开发者项目中有关CSS的统计信息。
• CSS Shrink——压缩工具
• UnCSS——移除无用CSS，可集成到Grunt和Gulp中。
• Critical path——提取和整合HTML中关键的CSS。

#####HTML

• HTML Minifier——压缩工具
• gulp-htmlmin——压缩HTML的gulp插件
• grunt-contrib-htmlmin——压缩html的grunt插件

#####JavaScript

• uglifyjs——JavaScript解析器、混淆、压缩和美化工具集。

转载于:https://my.oschina.net/jediKnight/blog/512355