您的位置:知识库 » .NET技术

20 种提升网页速度的技巧

作者: Marco Kotrotsos  来源: developerWorks 中国  发布时间: 2009-04-17 14:08  阅读: 4309 次  推荐: 0   原文链接   [收藏]  
摘要:您希望加快网页的加载速度吗?了解如何通过缩短加载时间来改善拨号上网用户的浏览体验,在某些情形下,加载时间最多可缩短 80%。
[1] 基本工具
[2] 常识:牢记设计规则
[3] 检查 cookie 使用情况
[4] 尽可能延迟脚本加载
[5] 使用 PNG 格式的图像
[6] 使用 YSlow 分析网页

使用 PNG 格式的图像

  Graphic Interchange Format (GIF) 和 Joint Photographic Experts Group (JPEG) 图像格式都已过时了:Portable Network Graphic (PNG) 是未来流行的格式。当然,您可以说 GIF 和 JPEG 已经消亡,或者 PNG 没有任何缺陷,但是所有事物都有各自的优缺点,PNG 以最佳的文件大小提供了出色的质量。因此,如果进行选择的话,应该尽可能使用 PNG 图像。

保持 Ajax 调用简短、准确

  当统称为 Asynchronous JavaScript + XML (Ajax) 的技术在两年前出现时,这些技术为处理页面请求和响应提供了一种革命性方法。然而,拨号用户可能从来没机会体验其真正的优势,因为在许多情形下,Ajax 需要在浏览器与服务器之间大量通信。因此,如果您能够保持 Ajax 调用简短和准确,可以避免用户花费无止尽的时间来等待元素刷新或响应。

进行一次较大的 Ajax 调用并在本地处理客户机数据

  如果不能进行简短的 Ajax 调用,或者如果这些调用不能提供期望的结果,可以考虑一种替代方法:进行一次大的 Ajax 调用来获取所需的一切内容,然后让客户机在本地处理数据。通过这种方式,客户机只需等待一次(获取传入的数据),但是在此之后(当浏览器与服务器之间没有必要通信时),处理速度将更快。当然,还有大量 Ajax 优化技术,本教程无法一一列出。如果想要了解关于 Ajax 的更多信息,请查看 参考资料。

在沙箱中测试代码

  还有一个经常被遗忘的常用技巧。尽管清醒的 Web 开发人员通常会在启动应用程序之前对其进行测试,但是有时候测试会使他们不那么重视维护任务,或者新功能添加得太快,并且未经过充分考虑或测试。结果,余下的脚本减缓了应用程序的速度。

  如果您添加一项新功能,可以首先在沙箱里(完全脱离了应用程序的其余部分)进行测试,查看它作为单个函数的行为。通过这种方式,您可以反复检查,并分析性能和响应时间,无需考虑 Web 应用程序的其余部分。然后,当新功能的行为符合预期时,可以将其引入到应用程序的其余部分中,运行其他测试,保证功能本身的行为符合预期。

分析站点代码

  在许多场景中,自我反省是一个不错的建议。幸运的是,在开发过程中,我们可以使用工具来帮助反省,并尽可能客观地进行实践。像 JSLint(参见 参考资源)这样的工具的价值是无法衡量的,尽管其站点宣称它 “可能令您备受挫折”,因为它向您提供了所有的潜在代码缺陷,这些缺陷不但使调试更加困难,而且可能导致更长的响应时间。

使用 JSLint 检查 JavaScript 代码中的错误或糟糕的编码实践

  您不需要像完美主义者那样追求完美无缺的 JavaScript 代码。但是,许多开发人员没有认真对待代码分析,通常在开发过程中跳过了这个步骤。不幸的是,错误和糟糕的编码实践不仅不太专业,而且可能减缓应用程序的速度。当浏览器忙于应付错误和糟糕的编码实践时,加载不仅需要更多时间,还会导致难以调试的错误。

  因此,如果想要获得良好的代码,可以考虑使用代码分析工具。有许多不同的工具可供使用,但是最适合 JavaScript 语言的工具非 JavaScript Lint 莫属,它也叫做 JSLint(参见 参考资料)。也可以使用 Firebug,但是 JSLint 更加正式,它包含在 YSlow 中。

检查孤立的文件和丢失的图像

  检查孤立的文件和丢失的图像是一种明智之举。大部分 Web 开发人员都会检查错误的文件引用,但是这里仍然需要说明一下。丢失的文件容易引起各种问题,因为它们会导致 “The image/page cannot be displayed” 之类的错误消息。但是在网页速度优化方面,它们具有更大的缺陷:当浏览器寻找丢失的或孤立的文件时,它会消耗资源,这不可避免地会导致页面处理速度变慢。因此,请检查孤立或丢失的文件,包括拼写错误的文件名。

0
0
标签:Firebuy YSlow

.NET技术热门文章

    .NET技术最新文章

      最新新闻

        热门新闻