浏览器
疯狂的小土蘑
一个小前端,学习中,希望能够成长
展开
-
【浏览器原理】浏览器执行顺序
脑图下面是详细说明一下事件循环:首先,明确浏览器是多线程的,而js是单线程,至于为什么是单线程,阮一峰大神的博客是这么说的:原因大概是不想让浏览器变得太复杂,因为多线程需要共享资源、且有可能修改彼此的运行结果,对于一种网页脚本语言来说,这就太复杂了。后来就约定俗成,JavaScript为一种单线程语言。(WorkerAPI可以实现多线程,但是JavaScript本身始终是单线程的。)其次,明确Event Loop是一个程序结构,译为事件循环,用于等待和发送消息和事件,主要是连接主线程与负责主线原创 2022-03-16 17:16:14 · 794 阅读 · 0 评论 -
【浏览器原理】V8引擎是如何处理JavaScript代码的?
脑图大家先看下脑图吧,估计看完应该能清晰的理解V8处理JavaScript的流程。其实,脑图中也主要是以下几个方面:首先介绍编译器和解释器的区别。紧接着又分析了 V8 是如何执行一段 JavaScript 代码的:V8 依据 JavaScript 代码生成 AST和执行上下文,再基于 AST 生成字节码,然后通过解释器执行字节码,通过编译器来优化编译字节码。基于字节码和编译器,又介绍了 JIT 技术。最后延伸说明了下优化 JavaScript 性能的一些策略。其中,我认为AST是非常重要原创 2022-03-14 11:22:05 · 860 阅读 · 0 评论 -
【浏览器原理】垃圾回收
脑图大家可以通过分析以下代码研究一下垃圾回收机制:function foo(){ var a = 1 var b = {name:" a "} function showName(){ var c = " b " var d = {name:" b "} } showName()}foo()原创 2022-03-11 11:05:05 · 158 阅读 · 0 评论 -
【浏览器原理】内存机制
脑图相信学过JavaScript的童鞋应该对栈和堆都不陌生,所以这块没什么好说的了。通过堆栈就可以解释闭包开辟的空间closursefunction foo() { var myName = " a " let test1 = 1 const test2 = 2 var innerBar = { setName:function(newName){ myName = newName }, get原创 2022-03-09 17:08:05 · 935 阅读 · 0 评论 -
【浏览器原理】This
脑图可以根据以下代码理解脑图内容:var myObj = { name : " a ", showThis: function(){ this.name = " b " console.log(this) }}var foo = myObj.showThisfoo()var myObj = { name : " a ", showThis: function(){ console.log(this) }}myObj.showThis()原创 2022-03-08 14:29:42 · 57 阅读 · 0 评论 -
【浏览器原理】作用域链
脑图可以根据以下代码感受作用域链:function bar() { var myName = " a " let test1 = 100 if (1) { let myName = " b " console.log(test) }}function foo() { var myName = " c " let test = 2 { let test = 3 bar()原创 2022-03-07 14:31:36 · 110 阅读 · 0 评论 -
【浏览器原理】块级作用域(ES6)
脑图代码思考:var myname = " a "function showName(){ console.log(myname); if(0){ var myname = " b " } console.log(myname);}showName()输出:undefined undefinedfunction foo(){ for (var i = 0; i < 7; i++) { } console.log(i); }foo()输出:7原创 2022-03-04 16:58:53 · 199 阅读 · 0 评论 -
【浏览器原理】调用栈
脑图原创 2022-03-02 16:01:38 · 171 阅读 · 0 评论 -
【浏览器原理】变量提升
脑图原创 2022-02-28 16:50:27 · 83 阅读 · 0 评论 -
【浏览器原理】渲染流程
脑图原创 2022-02-24 10:32:53 · 367 阅读 · 0 评论 -
【浏览器原理】导航流程
脑图原创 2022-02-23 10:45:55 · 168 阅读 · 0 评论 -
【浏览器原理】HTTP流程
脑图原创 2022-02-22 10:39:00 · 1209 阅读 · 0 评论 -
【浏览器原理】TCP/IP协议
脑图原创 2022-02-21 16:01:30 · 859 阅读 · 0 评论 -
【浏览器原理】Chrome架构
近期在学习,导出脑图原创 2022-02-18 16:15:24 · 1068 阅读 · 0 评论