浏览器的工作原理(一)

目录

  • 主流浏览器及其内核
  • 浏览器标准的制定
  • 浏览器技术的不断迭代
  • 核心模块
    • 1.浏览器架构设计
    • 2.JavaScript引擎的工作原理
    • 3.页面工作原理
    • 4.浏览器网络
    • 5.浏览器安全

主流浏览器及其内核

浏览器 内核
IE trident内核
Firefox(火狐) gecko内核
Safari webkit内核
Opera 以前是presto内核,现已改用Google Chrome的Blink内核
Chrome Blink内核 (基于webkit, Google与Opera Software共同开发)

浏览器标准的制定

在浏览器的发展过程中,制定并实现了很多标准;
一部分的标准没有得到广泛的应用如:

  • WebSQL 可以在页面中使用数据库SQL语言
  • FileSystem 可以在页面中以文件的形式读写数据
  • Application Cache 可以把页面内容缓存到本地,像APP一样
    这个经过改造,以PWA的身份出现了

被广泛应用的标准如:

  • WebSocket 一种在单个 TCP 连接上进行全双工通讯的协议
  • CSS Animation CSS3的动画属性
  • WebGL 一种3D绘图协议
  • WebRTC 一个支持网页浏览器进行实时语音对话或视频对话的API
  • WebAssembly 一种可以使用非 JavaScript 编程语言编写代码并且能在浏览器上运行的技术方案 图说 WebAssembly
  • 还有很多。。。

浏览器技术的不断迭代

浏览器的工作原理(一)_第1张图片

核心模块

1. 浏览器架构设计

早期: 单进程浏览器
所有的页面和插件都是运行在一个进程里面的,其中的一个页面的卡顿和崩溃都会影响到其他页面
浏览器的工作原理(一)_第2张图片

现在: 多进程架构
每个页面都是运行在单独的进程里面的
浏览器的工作原理(一)_第3张图片
未来: 朝着面向服务架构(SOA)的方向演化
浏览器的工作原理(一)_第4张图片

2.JavaScript引擎的工作原理

浏览器的工作原理(一)_第5张图片
站在浏览器中JavaScript引擎的角度来分析其代码的执行流程;在该基础上,结合浏览器中的事件循环机制,来理解回调,微任务,宏任务,Promise等概念

3.页面工作原理

页面中的事件循环系统
浏览器的工作原理(一)_第6张图片
构建页面的核心流程
数据接收到页面显示的整个核心流程
浏览器的工作原理(一)_第7张图片

5.浏览器网络

浏览器的工作原理(一)_第8张图片

5.浏览器安全

不安全的地方:

  • 网络传输过程中,数据可能会被串改或者被窃取
  • 操作系统层面,恶意的Web应用可以通过浏览器的漏洞来攻击操作系统
  • 浏览器层面,恶意程序获取浏览器页面的一些隐私信息

安全策略:

  • 沙箱
  • HTTPS HTTP 和 HTTPS 的区别
  • XSS XSS,CSRF,SQL注入
  • CSRF
  • 同源策略 前端之同源策略和跨域问题解决方法

你可能感兴趣的:(其他)