HTML解析原理

  标准的web前端工程师需要知道 ◎浏览器(或者相应播放器)的渲染/重绘原理 

  这我得加把劲了。我还真的说的不是很清楚,我就G下,结果不是很多,找到了有一个,就记下来了。。。

  以下部分来自handawei-javaeye的blog:

  1.  
  2.   Web页面运行在各种各样的浏览器当中,浏览器载入、渲染页面的速度直接影响着用户体验

  3.   简单地说,页面渲染就是浏览器将html代码根据CSS定义的规则显示在浏览器窗口中的这个过程。先来大致了解一下浏览器都是怎么干活的:

  4.   1. 用户输入网址(假设是个html页面,并且是第一次访问),浏览器向服务器发出请求,服务器返回html文件;

  5.   2. 浏览器开始载入html代码,发现
  1. 标签内有一个
  1. 标签引用外部CSS文件;

  2.   3. 浏览器又发出CSS文件的请求,服务器返回这个CSS文件;

  3.   4. 浏览器继续载入html

部分的代码,并且CSS文件已经拿到手了,可以开始渲染页面了;

  5.
浏览器在代码中发现一个标签引用了一张图片,向服务器发出请求。此时浏览器不会等到图片下载完,而是继续渲染后面的代码;

  6.
服务器返回图片文件,由于图片占用了一定面积,影响了后面段落的排布,因此浏览器需要回过头来重新渲染这部分代码;

  7. 浏览器发现了一个包含一行Javascript代码的

HTML解析原理概括(转载)的更多相关文章

  1. netty对http协议解析原理解析(转载)

    本文主要介绍netty对http协议解析原理,着重讲解keep-alive,gzip,truncked等机制,详细描述了netty如何实现对http解析的高性能. 1 http协议 1.1 描述 标示 ...

  2. jQuery 2.0.3 源码分析Sizzle引擎解析原理

    jQuery 2.0.3 源码分析Sizzle引擎 - 解析原理 声明:本文为原创文章,如需转载,请注明来源并保留原文链接Aaron,谢谢! 先来回答博友的提问: 如何解析 div > p + ...

  3. xml之DOM方式解析,DOM4J工具解析原理

    DOM解析原理: DOM解析原理:xml解析器一次性把整个xml文档加载进内存,然后在内存中构建一颗Document的对象树,通过Document对象,得到树上的节点对象,通过节点对象访问(操作)到x ...

  4. Atitit.sql ast 表达式 语法树 语法 解析原理与实现 java php c#.net js python

    Atitit.sql ast 表达式 语法树 语法 解析原理与实现 java php c#.net js python 1.1. Sql语法树 ast 如下图锁死1 2. SQL语句解析的思路和过程3 ...

  5. [转]netty对http协议解析原理

    本文主要介绍netty对http协议解析原理,着重讲解keep-alive,gzip,truncked等机制,详细描述了netty如何实现对http解析的高性能. 1 http协议 1.1 描述 标示 ...

  6. 基于简单sql语句的sql解析原理及在大数据中的应用

    基于简单sql语句的sql解析原理及在大数据中的应用 李万鸿 老百姓呼吁打土豪分田地.共同富裕,总有一天会实现. 全面了解你所不知道的外星人和宇宙真想:http://pan.baidu.com/s/1 ...

  7. SAX解析原理示意

    SAX解析原理示意

  8. DOM解析原理示意

    DOM解析原理示意  

  9. netty对http协议解析原理解析

    本文主要介绍netty对http协议解析原理,着重讲解keep-alive,gzip,truncked等机制,详细描述了netty如何实现对http解析的高性能. 1 http协议 1.1 描述 标示 ...

随机推荐

  1. JS存取Cookies值,附自己写的获取cookies的一个方法

    参考:脚本之家 这里对cookie进行了说明,也介绍了几个方法,但是我要取我存的cookie时取不到,他的方法只是针对存的  名字-值,不涉及键,所以自己写了个方法,来满足我的需求. ①你首先的了解C ...

  2. 测试与开发如何有效沟通,QC11(HP ALM 11)的简单使用记录

    笔者所在的项目组使用的缺陷管理工具是HP的QC11,作为测试人员,为了与开发一起跟随Bug的一生,简单的写了使用流程,这里记录一下,主要是让开发人员熟悉一下. 首先使用账户登录QC,如地址: http ...

  3. DynamicXml

    /* var xml = @"<root><books><book is_read=""false""><a ...

  4. IPython+:一个交互式计算和开发环境

    一. IPython基础 代码自动补全:Tab键 可补全内容包括:变量名.函数名.成员变量函数.目录文件 内省(Itrospection) 在变量名之前或之后加上问号(?),这样可以显示这个对象的相关 ...

  5. ajax轮询实时获取数据

    最近做一个评论功能时,想要实现实时异步刷新评论功能,于是使用了ajax轮询,这里简单记录一下ajax轮询的原理及使用方法. ajax轮询的原理就是客户端定时向服务端发送ajax请求,服务器接到请求后马 ...

  6. GO 语言简介(网摘)

    GO 语言简介 原文出处:[陈皓 coolshell] Hello World 文件名 HELLO.GO package main //声明本文件的package名 import "fmt& ...

  7. 剑指OFFER——调整数组顺序使奇数位于偶数前面

    输入一个整数数组,实现一个函数来调整该数组中数字的顺序,使得所有的奇数位于数组的前半部分,所有的偶数位于位于数组的后半部分,并保证奇数和奇数,偶数和偶数之间的相对位置不变. 剑指offer书里的版本, ...

  8. 'IFileDialog' : no GUID has been associated with this object

    在VS2010中使用IFileDialog,提示一下错误: 'IFileDialog' : no GUID has been associated with this object MSDN上明确表示 ...

  9. How to make sure your machine is always online without sleep

    1. Create a "NeverOff" power plan: Control Panle->System and Security->Power Options ...

  10. Linux中的内核链表

    链表中一般都要进行初始化.插入.删除.显示.释放链表,寻找节点这几个操作,下面我对这几个操作进行简单的介绍,因为我的能力不足,可能有些东西理解的不够深入,造成一定的错误,请各位博友指出. A.Linu ...