快速搞定前端JS面试 -- 第十二章 运行环境 (页面加载、性能优化、安全)(2)

7. 尽早开始JS执行

8. 防抖

9. 节流

三、安全

1. XSS跨站请求攻击

2. XSRF跨站请求伪造

问题解答

1. 从输入url到显示出页面的整个过程

2. Window.onload和DOMContentLoaded区别

3. 为何把css放在中

4. 为何把js放在最后

5. html中css写在前js写在后的优点

6. 如何入手性能优化

7. 防抖节流以及手写代码

8. 常见的Web前端攻击方式有哪些

---

运行环境即浏览器（server端有nodejs）

下载页面代码，渲染出页面，期间会执行若干JS

要保证代码在浏览器中：稳定且高效

一、页面加载过程

============

1. 资源的形式

---

（1）Html代码

（2）媒体文件，如图片，视频等

（3）JavaScript css

2. 渲染过程

---

（1）根据HTML代码生成DOM树

（2）根据CSS代码生成CSSOM（CSS对象模型）

（3）将DOM树和CSSOM整合形成Render Tree（渲染树）

（4）根据Render Tree渲染页面

3. 页面加载过程

---

（1）根据HTML代码生成DOM树

（2）根据CSS代码生成CSSOM（CSS对象模型）

（3）将DOM树和CSSOM整合形成Render Tree（渲染树）

（4）根据Render Tree渲染页面

（5）遇到

（6）直至把Render Tree渲染完成

4. Window.onload和DOMContentLoaded

---

Window.addEventLiatener(‘load’, function() {

// 页面的全部资源加载完才会执行，包括图片视频等

})

Document.addEventListener(‘DONContentLoaded’, function() {

// DOM渲染完成即可执行，此时图片视频可能还没有加载完成

})

二、性能优化

==========

是一个综合问题，没有标准答案，但是要求尽量全面

细节问题