02web前端开发知识储备

一 网站和网页的关系

1.什么是网页?

• 网页的专业术语叫做 Web Page；

• 打开浏览器查看到的页面，是网络中的一“页”；

• 网页的内容可以非常丰富：包括文字、链接、图片、音乐、视频等等

2.网站是什么呢？

• 网站是由多个网页组成的；

• 通常一个网站由N个网页组成（N >= 1）；

二 网页的显示过程

1.用户角度

1.用户在浏览器输入一个网站；

2.浏览器会找到对应的服务器地址，请求静态资源（可以存放在世界上任何一个地方）

3.服务器返回静态资源给浏览器;

4.浏览器对静态资源进行解析和展示；

2.前端工程师角度

1.开发项目（HTML/CSS/JavaScript/Vue/React）

2.打包、部署项目到服务器里面

3.世界上第一个网页

上世纪90年代，Berners-Lee上线了世界上第一个网站：http://info.cern.ch/hypertext/WWW/TheProject.html

虽然目前我们会认为这个网页简单到不值一提，但是在当时它的发明是“天才之作”。

三 网页的组成部分

• 阶段一：HTML元素；

• 阶段二：HTML元素 + CSS样式；

• 阶段三：HTML元素 + CSS样式 + JavaScript语言；

• HTML: 网页的内容结果

• CSS : 网页的视觉体验

• JavaScript: 网页的交互处理

四 浏览器和浏览器内核

1.浏览器的作用

作用:将代码渲染成网页

核心: 浏览器的内核

2.浏览器的渲染引擎

浏览器最核心的部分是渲染引擎（Rendering Engine），一般也称为“浏览器内核”

• 负责解析网页语法，并渲染（显示）网页

3.不同浏览器的内核

• Trident （ 三叉戟）：IE、360安全浏览器、搜狗高速浏览器、百度浏览器、UC浏览器；
• Gecko（ 壁虎） ：Mozilla Firefox；
• Presto（急板乐曲）-> Blink （眨眼）：Opera
• Webkit ：Safari、360极速浏览器、搜狗高速浏览器、移动端浏览器（Android、iOS）
• Webkit -> Blink ：Google Chrome

不同的浏览器内核有不同的解析、渲染规则，所以同一网页在不同内核的浏览器中的渲染效果也可能不同。