• 欢迎访问MACD实战投资网站,推荐使用最新版谷歌Chrome浏览器访问本网站,关注公众号 丁火甲木庚金 www.macd11.com/subscriptions

Web前端性能优化建议与工具

未分类 丁火 15年前 (2010-08-15) 2701次浏览 0个评论

为了加快网站访问速度,除了可以优化后端数据库,cache,操作系统,web 服务器,重新设计架构以外,优化前端页面性能也很重要。

建议

Yahoo 的性能小组经过长期的研究总结出了几条让网站访问更快的实战经验:Best Practices for Speeding Up Your Web Site。High Performance Web Sites 和 YSlow 的作者 Steve Souders 在其教授的 Stanford CS193H 课程里谈到了这14条建议

Make fewer HTTP requests
Use a CDN
Add an Expires header
Gzip components
Put stylesheets at the top
Put scripts at the bottom
Avoid CSS expressions
Make JS and CSS external
Reduce DNS lookups
Minify JS
Avoid redirects
Remove duplicate scripts
Configure ETags
Make AJAX cacheable


随后 Steve Souders 在其新书 Even Faster Web Sites 谈到了更多建议

Splitting the initial payload
Loading scripts without blocking
Coupling asynchronous scripts
Positioning inline scripts
Sharding dominant domains
Flushing the document early
Using iframes sparingly
Simplifying CSS Selectors
Understanding Ajax performance……….Doug Crockford
Creating responsive web apps…………Ben Galbraith, Dion Almaer
Writing efficient JavaScript………….Nicholas Zakas
Scaling with Comet…………………Dylan Schiemann
Going beyond gzipping……………Tony Gentilcore
Optimizing images……………….Stoyan Stefanov, Nicole Sullivan

工具

Yahoo 性能小组根据 Best Practices for Speeding Up Your Web Site 给出的建议提供了免费的 Web 前端评估工具YSlow,严格的说 YSlow 不能用来优化网站,只是用来评估网站的性能然后给出建议。Google 也提供了类似的 open source 工具Page Speed。这2个工具都需要 Firefox 并且需要安装 Firebug 插件。

CSS 在线优化工具http://www.cleancss.com/

CSS 图片组合器:http://spritegen.website-performance.org/

JavaScript 优化工具YUI Compressor

图片在线优化工具Smush.it

作者:vpsee


macd11.com 和 丁火甲木庚金 公众号版权所有丨如未注明 , 均为原创丨转载请注明原文链接。
喜欢 (0)
[sp91@qq.com]
分享 (0)

您必须 登录 才能发表评论!