• 浏览器对脚本和样式表的处理顺序

    浏览器的预解析
    服务器君一共花费 18.439 ms 进行了 2 次数据库查询,努力地为您提供了这个页面。
    广告很萌的

    对脚本script的处理

    网络的模型是同步的。网页作者希望解析器遇到 script 标记时立即解析并执行脚本。文档的解析将停止,直到脚本执行完毕。

    如果脚本是外部的,那么解析过程会停止,直到从网络同步抓取资源完成后再继续。此模型已经使用了多年,也在 HTML4 和 HTML5 规范中进行了指定。作者也可以将脚本标注为“defer”,这样它就不会停止文档解析,而是等到解析结束才执行。

    HTML5 增加了一个选项,可将脚本标记为异步,以便由其他线程解析和执行。

    Speculative parsing 预解析

    Webkit 和 Firefox 都进行了这项优化。在执行脚本时,其他线程会解析文档的其余部分,找出并加载需要通过网络加载的其他资源。通过这种方式,资源可以在并行连接上加载,从而提高总体速度。

    请注意,预解析器不会修改 DOM 树,而是将这项工作交由主解析器处理;预解析器只会解析外部资源(例如外部脚本、样式表和图片)的引用。

    对样式表Style sheets的处理

    另一方面,样式表有着不同的模型。理论上来说,应用样式表不会更改 DOM 树,因此似乎没有必要等待样式表并停止文档解析。但这涉及到一个问题,就是脚本在文档解析阶段会请求样式信息。如果当时还没有加载和解析样式,脚本就会获得错误的回复,这样显然会产生很多问题。这看上去是一个非典型案例,但事实上非常普遍。

    Firefox 在样式表加载和解析的过程中,会禁止所有脚本。而对于 Webkit 而言,仅当脚本尝试访问的样式属性可能受尚未加载的样式表影响时,它才会禁止该脚本。

更多 推荐条目

Welcome to NowaMagic Academy!

现代魔法 推荐于 2013-02-27 10:23   

本章最新发布
随机专题
  1. [Python程序设计] urls.py设置技巧 8 个条目
  2. [移动开发] 从代码角度去认识 Handler 4 个条目
  3. [Python程序设计] Tornado源码解析 23 个条目
  4. [PHP程序设计] httpd.conf设置相关 3 个条目
  5. [移动开发] Android布局基本知识 3 个条目
  6. [PHP程序设计] PHP数组探索 4 个条目
  7. [Linux操作系统] CentOS上使用EPEL Repository 2 个条目
  8. [数据库技术] SQL基础语法 1 个条目
  9. [软件工程与项目管理] 开始使用Git 3 个条目
  10. [软件工程与项目管理] 浏览器的HTML解析器 8 个条目
  11. [PHP程序设计] PHP扩展模块安装 1 个条目
  12. [C语言程序设计] 结构体基本知识 1 个条目
窗口 -- [博客]