2018年3月5日

页面重绘和回流(重排)以及优化

摘要: 1. 当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流,就是在页面第一次加载的时候。在回流的时候,浏览器会使渲染树中受到影响的部分失效,并重新构造这部分渲染树,完成回流后,浏览器会重新绘制受影响的部 阅读全文

posted @ 2018-03-05 17:13 杨龙飞 阅读(289) 评论(0) 推荐(0)

浏览器渲染过程

摘要: 1. 浏览器把获取到的HTML代码解析成1个DOM树,HTML中的每个tag都是DOM树中的1个节点,根节点就是我们常用的document对象。DOM树里包含了所有HTML标签,包括display:none隐藏,还有用JS动态添加的元素等。 2. 浏览器把所有样式(用户定义的CSS和用户代理)解析成 阅读全文

posted @ 2018-03-05 17:08 杨龙飞 阅读(154) 评论(0) 推荐(0)

渐进增强 VS 优雅降级

摘要: 渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。 优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 阅读全文

posted @ 2018-03-05 16:57 杨龙飞 阅读(134) 评论(0) 推荐(0)

BFC概念和作用,触发条件

摘要: 1、概念,全称是block format context,块级格式化上下文 2、触发条件 根元素 float属性不为none position为absolute或fixed display为inline-block, table-cell, table-caption, flex, inline-f 阅读全文

posted @ 2018-03-05 16:15 杨龙飞 阅读(1528) 评论(0) 推荐(0)

chrome cpu占用100%

摘要: 参考原文地址:https://stackoverflow.com/questions/20276097/chrome-devtools-100-cpu 问题描述,chrome打开devtools开发者工具,就会特别耗用cpu和内存,内存使用量一直增加,直到电脑崩溃 解决办法,打开开发者工具,找到so 阅读全文

posted @ 2018-03-05 15:50 杨龙飞 阅读(2940) 评论(0) 推荐(0)

导航

Fork me on GitHub