前端
关注
分享
扫一扫
文章平均质量分 82
w_tt
这个作者很懒，什么都没留下…
展开
-
canvas学习笔记（一）：弹跳的小球
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <canvas id="cont" width="500" height="500">您的浏览器版本过低！</canvas> <script> /* 固定-start */ var canvas.原创 2021-09-13 16:04:14 · 163 阅读 · 0 评论 -
浏览器工作原理与实践学习笔记（三）：渲染流程(上)
一、HTML、CSS 和 JavaScript 二、渲染流水线 按照渲染的时间顺序，流水线可分为如下几个子阶段：构建 DOM 树、样式计算、布局阶段、分层、绘制、分块、光栅化和合成。 开始每个子阶段都有其输入的内容； 然后每个子阶段有其处理过程； 最终每个子阶段会生成输出内容。 三、构建 DOM 树 为什么要构建 DOM 树呢？这是因为浏览器无法直接理解和使用 HTML，所以需要将 HTML 转换为浏览器能够理解的结构——DOM 树。 图中的 document 就是 DOM 结构，可以看到，DOM原创 2021-08-18 10:30:32 · 101 阅读 · 0 评论 -
浏览器工作原理与实践学习笔记（二）：从输入 URL 到页面展示
一、流程 首先，浏览器进程接收到用户输入的 URL 请求，浏览器进程便将该 URL 转发给网络进程。 然后，在网络进程中发起真正的 URL 请求。 接着网络进程接收到了响应头数据，便解析响应头数据，并将数据转发给浏览器进程。 浏览器进程接收到网络进程的响应头数据之后，发送“提交导航 (CommitNavigation)”消息到渲染进程； 渲染进程接收到“提交导航”的消息之后，便开始准备接收 HTML 数据，接收数据的方式是直接和网络进程建立数据管道； 最后渲染进程会向浏览器进程“确认提交”，这是告诉浏览原创 2021-08-17 15:49:25 · 143 阅读 · 0 评论 -
浏览器工作原理与实践学习笔记（一）：Chrome 进程架构
一、单进程浏览器时代 早在 2007 年之前，市面上浏览器都是单进程的。单进程浏览器的架构如下图所示： 问题1：不稳定 早期浏览器需要借助于插件来实现诸如 Web 视频、Web 游戏等各种强大的功能，但是插件是最容易出问题的模块，并且还运行在浏览器进程之中，所以一个插件的意外崩溃会引起整个浏览器的崩溃。 除了插件之外，渲染引擎模块也是不稳定的，通常一些复杂的 JavaScript 代码就有可能引起渲染引擎模块的崩溃。和插件一样，渲染引擎的崩溃也会导致整个浏览器的崩溃。 问题 2：不流畅 所有页面的渲染模块原创 2021-08-17 15:10:36 · 236 阅读 · 0 评论