道招
CKEditor4是怎么跑起来的(一)
我们先看CKEditor的入口ckeditor.js,它里面有一部分是压缩版,压缩版部分对应的源码地址为src/core/ckeditor_base.js // src/core/ckeditor_base.js if ( !window.CKEDITOR ) { window.CKEDITOR = ( function() { var basePathSrcPattern
《浏览器工作原理与实践》笔记之事件循环队列
为了能让你更加深刻地理解事件循环机制,我们就从最简单的场景来分析,然后带你一步步了解浏览器页面主线程是如何运作的。 使用单线程处理安排好的任务 我们先从最简单的场景讲起,比如有如下一系列的任务: 任务 1:1+2 任务 2:20/5 任务 3:7*8 任务 4:打印出任务 1、任务 2、任务 3 的运算结果 现在要在一个线程中去执行这些任务,通常我们会这样编写代码:
《浏览器工作原理与实践》笔记之垃圾回收
先了解下垃圾回收领域的重要术语——代际假说和分代收集。 代际假说 第一个是大部分对象在内存中存在的时间很短,简单来说,就是很多对象一经分配内存,很快就变得不可访问; 第二个是不死的对象,会活得更久。 分代收集 在 V8 中会把堆分为新生代和老生代两个区域,新生代中存放的是生存时间短的对象,老生代中存放的生存时间久的对象。 新生区通常只支持 1~8M 的容量,由
《浏览器工作原理与实践》笔记之闭包问题解答
Q: function fn() { var a = 10 function f1() { console.log(a) }; function f2() { console.log('f2') }; f2(); }; fn(); 我在函数f2里打断点,当执行到函数f2时,chro
《浏览器工作原理与实践》笔记之从堆栈空间看闭包过程
基础 我们先看下面的代码 function foo(){ var a = "极客时间" var b = a var c = {name:"极客时间"} var d = c } foo() 执行第 4 行代码,由于 JavaScript 引擎判断右边的值是一个引用类型,这时候处理的情况就不一样了,JavaScr
《浏览器工作原理与实践》笔记之JavaScript是如何支持块级作用域的
你已经知道 JavaScript 引擎是通过变量环境实现函数级作用域的,那么 ES6 又是如何在函数级作用域的基础之上,实现对块级作用域的支持呢? function foo(){ var a = 1 let b = 2 { let b = 3 var c = 4 let d = 5 console.log(a)
《浏览器工作原理与实践》笔记之CSS、JS阻塞DOM合成场景分析
当从服务器接收HTML页面的第一批数据时,DOM解析器就开始工作了。 我们先看第一种情况在解析过程中,如果遇到了JS脚本,如下所示: <html> <body> 极客时间 <script> document.write("--foo") </script> </body&g
《浏览器工作原理与实践》笔记之渲染流程
由于渲染机制过于复杂,所以渲染模块在执行过程中会被划分为很多子阶段,输入的 HTML 经过这些子阶段,最后输出像素。我们把这样的一个处理流程叫做渲染流水线,其大致流程如下图所示: 按照渲染的时间顺序,流水线可分为如下几个子阶段:构建 DOM 树、样式计算、布局阶段、分层、绘制、分块、光栅化和合成。 构建DOM树 为什么要构建 DOM 树呢?这是因为浏览器无法直接理解和使用 HTM
《浏览器工作原理与实践》笔记之从输入URL到页面展示发生了什么
从输入URL到页面展示发生了什么,大致过程如下 一、用户输入 浏览器进程接收到用户输入的 URL 请求,浏览器进程便将该 URL 转发给网络进程。 当用户输入关键字并键入回车之后,这意味着当前页面即将要被替换成新的页面,不过在这个流程继续之前,浏览器还给了当前页面一次执行 beforeunload 事件的机会,beforeunload 事件允许页面在退出之前执行一些数据清理
《浏览器工作原理与实践》笔记之HTTP 请求和响应流程
浏览器端发起 HTTP 请求流程 构建请求 浏览器构建请求报文信息,构建好后,浏览器准备发起网络 请求行 GET /index.html HTTP1.1 发送 请求行 ,就是告诉服务器浏览器需要什么资源,最常用的请求方法是 Get。 请求体 如果使用 POST 方法,那么浏览器还要准备数据给服务器,这里准备的数据是通过 请求体 来发送。 请求头 请求行之后,浏览
关注道招网公众帐号
道招开发者二群