1:css和js在网页中的放置位置?
css样式放在head中;js放置在body标签内的最后(防止阻塞后面内容的呈现,防止阻塞气候组件的下载),图片和css,会并发加载,而JavaScript会禁止并发;
2:解释白屏和FOUC
解析html标签,构建DOM树,解析CSS标签,构建CSSOM树,把DOM和CSSOM组合成渲染树(render tree),calculate(计算)节点几何结构,painting;白屏:浏览器在渲染的时候请求时间过长导致,使用@import()属性也可能导致渲染不及时。
FOUC现象(逐步加载无样式的内容,等加载后(CSS)页面突然展现样式)
Chrome:等待渲染树和位置计算好才会出来网页的内容;
FireFox:没加载一次DOM树就会重绘网页样式,知道所有的内容完成为止;
3:async和defer的作用?
async:加载和渲染后续文档元素的过程将和script.js的加载与执行并发进行(异步);
defer:异步,但script.js的执行要在所有元素解析完成之后,DoMcontentLoaded事件触发之前完成;
前者无顺序,后者有;
4:简述网页的渲染机制?
题二答案!
HTML>>DOM>>CSS>>CSSOM>>Rreder tree>>calculate>>painting;