- 博客(325)
- 资源 (3)
- 收藏
- 关注
原创 一个开源的个人学习计算机科学知识成长记录(前后端,数据结构与算法)
这里写自定义目录标题一个适合自学与巩固的学习记录前端项目积累前端入门HTMLCSSJavaScriptBrowserNodeDOMTypeScriptHTTPHTTP前端绘图前端进阶VueVuexVue-routerReactwebpacknodeAngular后端知识MVC网络数据库数据安全其他计算机基础消遣系统数据结构算法网络基础git面筋项目工业物联网设计模式一个适合自学与巩固的学习记录结构目录如下所示,内容不断增加中,在自己总结的同时,也会去论文上面搬运部分部分知识,再学习中不断进步。附上链
2020-12-17 21:10:06
1182
原创 浏览器工作原理与实践-14:编译器和解释器:V8是如何执行一段JavaScript代码的?
本文站在 JavaScript 引擎 V8 的视角,分析JavaScript 代码是如何被执行的。要深入理解 V8 的工作原理,你需要搞清楚一些概念和原理,比如接下来我们要详细讲解的编译器(Compiler)、解释器(Interpreter)、抽象语法树(AST)、字节码(Bytecode)、即时编译器(JIT)等概念。编译器和解释器之所以存在编译器和解释器,是因为机器不能直接理解我们所写的代码,所以在执行程序之前,需要将我们所写的代码“翻译”成机器能读懂的机器语言。按语言的执行流程,可以把语言划分为
2026-02-23 14:58:24
616
原创 浏览器工作原理与实践|27:渐进式网页应用(PWA):它究竟解决了Web应用的那些问题
浏览器的三大进化路线第一是应用程序Web化第二是Web应用移动化第三Web操作系统化;但是在现在环境中是移动端既有手机APP,同时也有各家小程序,Google为了让浏览器切入到移动端,退出了PWA。PWA(Progressive Web Application)渐进式网页应用(渐进式+网页应用)PWA 提供了一个渐进式的过渡方案,让普通站点逐步过渡到 Web 应用。采取渐进式可以降低站点改造的代价,使得站点逐步支持各项新技术,而不是一步到位。站在技术角度来说,PWA 技术也是一个渐进式的演
2026-02-23 14:57:24
526
原创 数据结构与算法 leetcode 209. 长度最小的子数组(双指针)
【代码】数据结构与算法 leetcode 209. 长度最小的子数组(双指针)
2026-01-19 04:32:14
149
原创 浏览器工作原理与实践 | 28 WebComponent : 像搭积木一样构建 Web 应用
组件化并没有一个明确的定义,对内高内聚,对外低耦合。
2026-01-16 17:50:04
729
原创 浏览器工作原理与实践:25|页面性能:如何系统地优化页面
页面优化,其实就是要让页面更快地显示和响应通常一个页面有三个阶段:加载阶段、交互阶段和关闭阶段。加载阶段,是指从发出请求到渲染出完整页面的过程,影响到这个阶段的主要因素有网络和 JavaScript 脚本。交互阶段,主要是从页面加载完成到用户交互的整合过程,影响到这个阶段的主要因素是JavaScript 脚本。关闭阶段,主要是用户发出关闭指令后页面所做的一些清理操作。重点关注加载阶段和交互阶段加载阶段并非所有的资源都会阻塞页面的首次绘制,比如图片、音频、视频等文件就不会阻塞页面的首次渲染;而
2026-01-03 17:15:49
667
原创 浏览器工作原理与实践| 23 渲染流水线,CSS是如何影响首次加载时的白屏时间
渲染流水线视角下的CSS```1//theme.cssdiv{ color : coral; background-color:black}<html><head><link href="theme.css" rel="stylesheet"></head><body> <div>geekbang com</div></body></html>首先是发起主页面的请求
2026-01-01 17:40:59
814
原创 浏览器工作原理与实践|22 DOM 树: JavaScript 是如何影响 DOM 树构建的?
沿着网络数据流路径来介绍 DOM 树是怎么生成的什么是DOMHTML 解析器并不是等整个文档加载完成之后再解析的,而是网络进程加载了多少数据,HTML 解析器便解析多少数据。网络进程和渲染进程之间会建立一个共享数据的管道,网络进程接收到数据后就往这个管道里面放,而渲染进程则从管道的另外一端不断地读取数据,并同时将读取的数据传递给 HTML 解析器。第一个阶段,通过分词器将字节流转换为 Token。V8 编译 JavaScript 过程中的第一步是做词法分析,将 JavaScript 先分解为一个
2025-12-27 04:37:12
930
原创 浏览器工作原理与实践| 21 Chrome开发工具:利用网络面板做性能分析
优化时间线上耗时项排队(Queuing)时间过久排队时间过久,大概率是由浏览器为每个域名最多维护 6 个连接导致的。那么基于这个原因,你就可以让 1 个站点下面的资源放在多个域名下面,比如放到 3 个域名下面,这样就可以同时支持 18 个连接了,这种方案称为域名分片技术。除了域名分片技术外,我个人还建议你把站点升级到 HTTP2,因为 HTTP2 已经没有每个域名最多维护 6 个 TCP 连接的限制了。2.第一字节时间(TTFB)时间过久服务器生成页面数据的时间过久网络的原因。发送请求头时.
2025-12-18 20:05:09
229
原创 浏览器工作原理与实践|20 | async/await : 使用同步的方式去写异步代码
前面介绍了怎么使用 Promise 来实现回调操作,使用 Promise 能很好地解决回调地狱的问题,但是这种方式充满了 Promise 的 then() 方法,如果处理流程比较复杂的话,那么整段代码将充斥着 then,语义化不明显,代码不能很好地表示执行流程。下面代码展示的是使用 fetch 来实现这样的需求,fetch 被定义在window 对象中,可以用它来发起对远程资源的请求,该方法返回的是一个 Promise 对象,这和我们上篇文章中讲的 XFetch 很像,只不过 fetch 是浏览器原生支持
2025-12-10 07:57:44
868
原创 浏览器工作原理与实践|19:Promise:使用 Promise ,告别回调函数
Promise DOM/BOM API 中新加入的 API 大多数都是建立在 Promise 上的,而且新的前端框架也使用了大量的 Promise。可以这么说,Promise 已经成为现代前端的“水”和“电”,很是关键,所以深入学习 Promise 势在必行。Promise 解决的是异步编码风格的问题,而不是一些其他的问题,所以接下来我们聊的话题都是围绕编码风格展开的。异步编程的问题:代码逻辑不连续上图展示的是一个标准的异步编程模型,页面主线程发起了一个耗时的任务,并将任务交给另外一个进程去处理,
2025-12-04 17:35:46
808
原创 浏览器工作原理与实践|18:微任务与宏任务
微任务可以在实时性和效率之间做一个有效的权衡。基于微任务的技术有MutationObserver、Promise 以及以 Promise 为基础开发出来的很多其他的技术。所以微任务的重要性也与日俱增,了解其底层的工作原理对于你读懂别人的代码,以及写出更高效、更具现代的代码有着决定性的作用。有微任务,也就有宏任务,那这二者到底有什么区别?它们又是如何相互取长补短的?宏任务页面中的大部分任务都是在主线程上执行的,这些任务包括了:渲染事件(如解析 DOM、计算布局、绘制);用户交互事件(如鼠标点击、滚
2025-11-27 06:27:09
294
原创 17⼁决策树(上):要不要去打篮球决策树来告诉你
17⼁决策树(上):要不要去打篮球决策树来告诉你决策树的⼯作原理决策树基本上就是把我们以前的经验总结出来。在做决策树的时候,会经历两个阶段:构造和剪枝。构造什么是构造呢?构造就是⽣成⼀棵完整的决策树。简单来说,构造的过程就是选择什么属性作为节点的过程,那么在构造过程 中,会存在三种节点:根节点:就是树的最顶端,最开始的那个节点。在上图中,“天⽓”就是⼀个根节点;内部节点:就是树中间的那些节点,⽐如说“温度”、“湿度”、“刮⻛”;叶节点:就是树最底部的节点,也就是决策结果。节点之间存在⽗⼦
2025-11-27 06:24:41
433
原创 数据结构与算法之 leetcode 98. 验证二叉搜索树 (前序,中序,后序遍历)
【代码】数据结构与算法之 leetcode 98. 验证二叉搜索树 (前序,中序,后序遍历)
2025-08-17 23:03:17
193
原创 浏览器工作原理与实践-12|栈空间和堆空间:数据是如何存储的
12|栈空间和堆控件:数据是如何存储的JavaScript内存机制function foo(){ var a = 1 var b = a a = 2 console.log(a) // 2 console.log(b) // 2}foo()function foo(){ var a = {name:"极客时间"} var b = a a.name = "极客邦" console.log(a) // {name:"极客邦"} console.log(b) // {name:"极
2024-12-23 23:41:06
1055
原创 浏览器工作原理与实践|合成机制:为什么CSS动画比JavaScript高效?
重排、重绘和合成重排,通常渲染路径越长,生成图像花费的时间就越多重绘 没有了重新布局的阶段,操作效率稍微高点,但是依然需要重新计算绘制信息,并触发绘制操作之后的一系列操作。合成 操作的路径就显得非常短了,并不需要触发布局和绘制两个阶段,如果采用了 GPU,那么合成的效率会非常高分层和合成为了提升每帧的渲染效率,Chrome 引入了分层和合成的机制。那该怎么来理解分层和合成机制呢?在 Chrome 的渲染流水线中,分层体现在生成布局树之后,渲染引擎会根据布局树的特点将其转换为层树(Layer Tr
2024-11-24 09:54:33
648
1
原创 浏览器工作原理与实践|HTTP-3:甩掉TCP、TLS的包袱,构建高效网络
在 TCP 传输过程中,由于单个数据包的丢失而造成的阻塞称为 TCP 上的队头阻塞。所以随着丢包率的增加,HTTP/2 的传输效率也会越来越差。有测试数据表明,当系统达到了 2% 的丢包率时,HTTP/1.1 的传输效率反而比 HTTP/2 表现得更好。TCP建立连接的延时网络延迟又称为 RTT(Round Trip Time)。把从浏览器发送一个数据包到服务器,再从服务器返回数据包到浏览器的整个往返时间称为 RTT(如下图)。RTT 是反映网络性能的一个重要指标。HTTP/1 和 HTTP/2
2024-11-21 10:06:17
873
3
原创 1202. 交换字符串中的元素
1202. 交换字符串中的元素/** * @param {string} s * @param {number[][]} pairs * @return {string} */var smallestStringWithSwaps = function(s, pairs) { // 有点像背包 // 字典序最小的排法 = (dp[n] + x , dp[n-1]) // 生成字典 计算字典的大小 let dic = new Map(); // dic.set('a
2024-11-21 10:04:51
220
1
原创 npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1,因为在此系统上禁止运行脚本。
RemoteSigned 就可以实现访问。
2024-11-17 16:37:37
933
原创 数据结构与算法之 leetcode 235. 二叉搜索树的最近公共祖先
【代码】数据结构与算法之 leetcode 235. 二叉搜索树的最近公共祖先。
2024-11-04 23:42:29
201
原创 centos 8.3 dotnet /lib64/libstdc++.so.9: version ‘GLBCXX_3.4.20‘ not found(required by dotnet)
在 CentOS 8.3 上运行 .NET 程序时,如果遇到类似于 /lib64/libstdc++.so.9: version ‘GLBCXX_3.4.20’ not found (required by …) 的错误,通常是因为系统中缺少特定版本的 GNU Standard C++ Library (libstdc++)。GLIBCXX_3.4.20 是 libstdc++ 库的一部分,某些软件可能依赖于该版本的功能。确保 GLIBCXX_3.4.20 版本在列表中。
2024-08-26 10:56:43
561
原创 Linux (centos ) 安装和使用 ffmpeg 教程
下载完成后一般在用户的目录,可以使用 mv 命令移动到某个目录下。由于我是放在 mnt 目录,所以就把这个放在了文件最后面。能够看到上面的内容就算完成了!
2024-08-25 20:59:37
817
原创 数据结构与算法之 leetcode 103. 二叉树的锯齿形层序遍历
【代码】数据结构与算法之 leetcode 103. 二叉树的锯齿形层序遍历。
2024-06-11 10:08:36
246
原创 数据结构与算法之 leetcode 513. 找树左下角的值 (BFS) 广度优先
【代码】数据结构与算法之 leetcode 513. 找树左下角的值 (BFS) 广度优先。
2024-06-05 19:00:00
384
原创 git pull 出错 fatal: bad object refs/remotes/origin/xxxxx
删除项目目录 .git\refs\remotes\origin 下面的所有文件。在 git pull。
2024-05-18 11:51:17
862
原创 数据结构与算法之 leetcode 713. 乘积小于 K 的子数组(双指针)
数据结构与算法之 leetcode 713. 乘积小于 K 的子数组(双指针)
2024-05-17 08:00:00
298
原创 angular开发之nodejs版本与angular版本的对照(nodejs项目版本不匹配)
Angular cli 與 Node.js 版本對照
2024-04-30 15:34:23
6176
1
WSNs无线传感网络技术学习资料
2018-07-12
《物联网中的无线传感网络技术》-《Internet of Things:Wireless Sensor Networks》
2018-07-11
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅