【读书笔记】Javascript DOM编程艺术（五） 最佳实践

5.1 过去的错误

    5.1.1 不要怪罪JavaScript

    5.1.2 Flash的遭遇        

    5.1.3 质疑一切

5.2 平稳退化

    5.2.1 “javascript:”伪协议

    5.2.2 内嵌的事件处理函数

    5.2.3 谁关心这个

5.3 向CSS学习

    5.3.1 结构与样式的分离

        （1）CSS技术的最大优点是，它能够帮助你将Web文档的内容结构（标记）和版面设计（样式）分离开来。

        （2）作为CSS技术的突出优点，文档结构与文档样式的分离可以确保网页都能平稳退化。

    5.3.2 渐进增强

        （1）标记良好的内容就是一切。

        （2）所谓“渐进增强”就是用一些额外的信息层去包裹原始数据。

        （3）CSS代码负责提供关于“表示”的信息，JavaScript代码负责提供关于“行为”的信息。

5.4 分离JavaScript

        （1）JavaScript语言不要求事件必须在HTML文档里处理，我们可以在外部JavaScript文件里把一个事件添加到HTML文档中的某个元素上：

                element.event = action...

        （2）只要把事件处理函数存入一个外部JavaScript文件，就等于是把这些操作从HTML文档里分离出来，这就是“分离JavaScript”的含义。

        （3）HTML文档全部加载完毕时，window对象将触发onload事件，这个事件有它自己的事件处理函数。

5.5 向后兼容

    5.5.1 对象检测

    5.5.2 浏览器嗅探技术

5.6 性能考虑

    5.6.1 尽量少访问DOM和尽量减少标记

        （1）访问DOM的方式对脚本性能会产生非常大的影响。

        （2）不管什么时候，只要是查询DOM中的某些元素，浏览器都会搜索整个DOM树，从中查找可能匹配的元素。

        （3）需要注意的地方，就是要尽量减少文档中的标记数量。过多不必要的元素只会增加DOM树的规模，进而增加遍历DOM树以查找特定元素的时间。

    5.6.2 合并和放置脚本

        （1）包含脚本的最佳方式就是使用外部文件，因为外部文件与标记能清晰地分离开，而且浏览器也能对站点中的多个页面重用缓存过的相同脚本。

        （2）在可能的情况下，将多个脚本合并到一个脚本文件中，这样就可以减少加载页面时发送的请求数量。而减少请求数量通常都是在性能优化时首先要考虑的。

        （3）一般来说，根据HTTP规范，浏览器每次从同一个域名中最多只能同时下载两个文件。而在下载脚本期间，浏览器不会下载其他任何文件，即使是来自不同域名的文件也不会下载，所有其他资源都要等脚本加载完毕后才能下载。

        （4）脚本在标记中的位置对页面初次加载时间也有很大影响。把所有<script>标签都放到文档的末尾，</body>标记之前，就可以让页面变得更快。即使这样，在加载脚本时，window对象的load事件依然可以执行对文档进行的各种操作。

    5.6.3 压缩脚本        

        （1）所谓压缩脚本，指的是把脚本文件中不必要的字节，如空格和注释，统统删除，从而达到“压缩”文件的目的。

        （2）多数情况下，你应该有两个版本，一个是工作副本，可以修改代码并添加注释；另一个是精简副本，用于放在站点上。最好在精简副本的文件名中加上min字样。

        （3）推荐给读者的几个有代表性的代码压缩工具：

                <1>Douglas Crockford的JSMin

                <2>雅虎的YUI Compressor

                <3>谷歌的Closure Compiler

5.7 小结