前端面试——渲染机制

什么是DOCTYPE及其作用

什么是DOCTYPE及作用
DTD(document type definition,文档类型定义)是一系列的语法规则,用来定义XML
或(X)HTML的文件类型。浏览器会使用它来判断文档类型,决定使用何种协议来解析,以及切换浏览器模式


DOCTYPE是用来声明文档类型和DTD规范的,一个主要的用途便是文件的合法性验证。
如果文件代码不合法,那么浏览器解析时便出一些差错 

浏览器是怎么渲染的

重排(Reflow)

定义
DOM结构中的各个元素都有自己的盒子(模型),这些都需要浏览器根据各种样式来计算并根据计算结果将元素放到它该出现的位置,这个过程称之为ref|ow


触发Reflow
当你增加、删除、修改DOM结点时,会导致Reflew或Repaint
当你移动DOM的位置,或是搞个动画的时候
当你修改CSS样式的时候
当你Resize窗囗的时候(移动端没有这个问题),或是滚动的时候
当你修改网页的默认字体时

重绘(Repaint)

定义
当各种盒子的位置、大小以及其他属性,例如颜色、字体大小等都确定下来后,浏览器于是便把这些元素都按照
各自的特性绘制了一遍,于是页面的内容出现了,这个过程称之为repaint


触发Repaint
DOM改动
CSS改动

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值