加载 Javascript 最佳实践

作者:sofish 来源:幸福收藏夹 时间:2011-01-16 18:29:00 

相信很多与页面打过交道的同学都对 Yahoo 的 Best Practices for Speeding Up Your Web Site 不陌生。而这 35 条最佳实践中,对 Javascript 的加载顺序的要求是:Put Scripts at the Bottom。因为根据HTTP/1.1 specification 看来,在同一时间加载两个文件是最理想的,而 Javascript 脚本会阻碍平行下载。Steve 说那是 2008 – 2009 那个时代用的。现在,加载 Javascript 已经有了革命性的化变。

在开讲之前,有一个必须解决的问题是:为什么我们要把 JS 文件放在 </body> 之前的最底部。根本原因是,它不能平行下载。而其实并不是所有浏览器都不支持。现在大部分浏览器都支持 Script 的平行下载,除了老掉牙的 IE6&7、Firefox 2&3.0、 Safari 3、Chrome 1。但我们最熟悉的老掉牙同学 IE6 (或以IE为核的那些壳)还是中国(甚至世界上)市场上占用率最高的浏览器,因此我们需要一个折衷的方案。

一、分析

我们有6种方法可以实现平行(NON-Blocking)下载:

  • XHR Eval – 用 XHR 下载,并 eval() 执行 responseText.。

  • XHR Injection – 用 XHR 下载,在页面中动态创建一个 script 元素,并将 responseText 作为其 text 。

  • Script in Iframe – 把脚本放在 HTML 中,使用 ifame  来下载它。

  • Script DOM Element – 动态创建一个 script 元素,把 src 指向脚本URL.

  • Script Defer – 给 script 标添加 defer 属性

  • document.write Script Tag – 利用 document.write 把 <script src=""> 添加到 HTML 中。但这个只对 IE 有效。

兼容性可看下图:

标签:加载,javascript
0
投稿

猜你喜欢

  • 实用技巧:优化SQL Server数据库查询方法

    2009-02-04 13:46:00
  • JavaScript框架比较:DOM遍历

    2010-04-23 14:41:00
  • 如何使用表单发送电子邮件?

    2010-05-16 15:13:00
  • 升级SQL Server 2008数据库引擎

    2009-03-25 12:58:00
  • 两个百度WEB面试题 怎么做?

    2010-09-03 18:40:00
  • ASP访问带多个参数的存储过程

    2008-10-14 16:45:00
  • [译]艺术和设计的差异 (1)

    2009-09-25 12:38:00
  • asp中格式化HTML函数代码 SDCMS加强版

    2011-02-20 11:18:00
  • MySQL数据库与表的最基本命令大盘点

    2010-08-31 14:29:00
  • 详细了解 MySQL锁机制

    2010-08-08 09:04:00
  • 大家一起来折磨浏览器吧!(好玩的东东)

    2010-02-07 12:40:00
  • css中如何使div居中(垂直水平居中)

    2007-08-13 08:17:00
  • 记录下两个正则表达式的使用

    2009-11-30 12:56:00
  • 设计能力决定权力

    2009-06-16 14:48:00
  • 注册表单的改进分解

    2008-05-31 17:19:00
  • MYSQL在一个字段值前面加字符串

    2010-10-14 14:28:00
  • 产品设计与用户体验

    2009-02-02 10:15:00
  • ASP 80040e14错误的解决方法

    2011-03-17 11:21:00
  • WML初级教程之从实际应用中了解WML

    2008-09-04 11:24:00
  • ASP实现下载系统防盗链方法

    2008-02-01 14:05:00
  • asp之家 网络编程 m.aspxhome.com