抱歉,您的浏览器无法访问本站

本页面需要浏览器支持(启用)JavaScript


了解详情 >

【浏览器原理-4】浏览器的页面渲染

课程链接:https://time.geekbang.org/column/intro/100033601?tab=catalog 渲染的整体流程 渲染流程是从 HTML 到页面的流程。由于它的机制太过于复杂,我们把这样的一个处理流程叫做渲染流水线。按照时间顺序,我们把渲染流水线大致分为: 构建 DOM 树 样式计算 布局 分层 绘制 分块 光栅化 合成 构建 DOM 树 服务器...

【浏览器原理-3】浏览器的导航流程

课程链接:https://time.geekbang.org/column/intro/100033601?tab=catalog 回顾 各个进程的职责 浏览器进程:用户交互、子进程管理、文件储存等 网络进程:网络下载 渲染进程:把下载的 HTML、JavaScript、CSS、图片等资源解析为可以显示和交互的页面 从用户输入 URL 到页面出现 从用户输入 URL 到页面出...

【浏览器原理-2】浏览器中的网络

课程链接:https://time.geekbang.org/column/intro/100033601?tab=catalog 浏览器的请求流程 发起请求 构建请求行 浏览器构建请求行信息,准备发起请求。 1GET /index.html HTTP1.1 查找缓存 浏览器缓存策略 浏览器会寻找该请求是否有对应的缓存,如果有,则直接结束请求流程,并返回资源副本。 准备 IP ...

【浏览器原理-1】体系结构

课程链接:https://time.geekbang.org/column/intro/100033601?tab=catalog 进程和线程 基本概念 进程:一个进程就是一个程序的运行实例。 线程:并发调度的基本单位。线程是由进程启动和管理的,但它不能单独存在。 几个要点 进程中的任意一线程执行出错,都会导致整个进程的崩溃。 线程之间共享进程的数据。 当一个进程关闭之后,操...

浏览器缓存策略

介绍 为什么需要浏览器缓存 当你第一次访问页面的时候,浏览器会自动下载所有与这个页面有关的资源,例如 CSS、网页字体、JavaScript脚本。 但是,在很短一段时间内,当你第二次访问网页时,这些资源往往是不变的。如果这个时候仍然再加载这些 CSS、网页字体、JavaScript脚本,那么,不但增加了服务器的负担,也增加了请求的时间,这对双方都是十分不利的。 如果这个时候能够把一些很少...

语义化的HTML

为什么要语义化 在 uni-app 等移动开发框架上,如果做过项目,就可以发现一个很常见的问题:整个页面几乎全是 <view>`` 这样的标签。 同样的,在网页端开发上,也会有光使用 div 来构建整个页面的功能: 12345678910`<div class="html">` ...`</div>``<div class=&...

Vue2源码阅读-响应性系统

开始 在继续阅读源码之前,可以先阅读 Vue2 官网的 深入响应式原理一节,了解一下Vue2响应性的一些基本内容和规则。 后面,我们透过源码,可以更好的理解这些官方文档所说的内容。 什么是响应性 Vue 其中的特点,就是它的数据是响应性的,所谓响应性,说简单点,就是修改数据后,UI可以自动刷新。 例如执行下面的代码,Vue会自动触发UI的更新。 1user.id = 1 要想实现响应性,...

Vue2源码阅读-介绍

从拷源码开始 首先,想搞清楚 Vue2 的源码,至少要把源码拷下来吧: 1git clone --branch v2.6.14 https://github.com/vuejs/vue.git 我们这里选用的是最新版本 2.6.14 的源代码。 目录结构简介 1234567891011121314151617181920212223242526vue├── dist ...

Vue2计算属性的实现原理

Vue2仓库链接:https://github.com/vuejs/vue 本文使用的是 2.6.14 版本的源代码 问题引入 我们来看一个具体的例子: 你可以 点击这里 来在线运行这个例子。 1234<div id="app"> <p>{{sum}}</p> <button @c...

Vue3基础-组合式API

介绍 在Vue2,中我们定义一个组件通常是这样的: 12345678910111213141516171819export default { data() { return { userInfo: { firstName: "a", lastName: "b" }, pos...