- 博客(24)
- 收藏
- 关注
RSS订阅原创 node文件流基础
流（Stream）是计算机科学中的一种用于处理数据的抽象概念。它允许你在传输数据的过程中，逐步读取和写入数据，而不是一次性将所有数据加载到内存中。流是有方向可读流（Readable Streams）：数据从外部源（如文件、网络请求等）被读取到内存中。可写流（Writable Streams）：数据从内存写入到外部目标（如文件、网络连接等）。双向流（Duplex Streams）：从本质上来说，双向流是将 可读流 和 可写流 的功能结合到一个流对象中，允许在同一个流中进行读取和写入操作。
2024-12-04 16:52:37
1089
原创 图解SSL/TLS 建立加密通道的过程
浏览器拿证书在建立连接时，浏览器会向服务器发送请求（如 GET 请求），然后服务器会返回其 SSL/TLS 证书。这个证书包含了服务器的公钥、证书颁发机构（CA）的签名，以及其他相关信息。浏览器验证证书浏览器会检查服务器的证书是否有效，验证证书是否由可信的证书颁发机构（CA）签发，以及证书中的公钥是否匹配预期的服务器。如果证书有效，浏览器继续进行下一步；否则，浏览器会显示警告或中断连接。浏览器生成对称加密密钥（key2）
2024-12-04 10:41:58
1476
原创 Node文件I/O操作之 fs 模块详解
在现代 Web 应用中，数据的持久化存储、日志记录、配置管理等操作都是日常开发中不可或缺的部分。无论是保存用户上传的文件，还是记录系统运行日志，文件输入输出（File I/O）操作都在其中发挥着至关重要的作用。在 Node.js 中，处理文件 I/O 的核心工具便是 fs 模块。这个模块提供了一套丰富的 API，支持从文件的读取、写入到监控文件的变化，能够帮助开发者高效地管理文件操作。本文将通过一系列典型的文件 I/O 操作，详细介绍 fs 模块的常用方法。
2024-11-30 10:32:05
654
原创 Node常用内置模块介绍(OS/path/URL/util)
官网：https://nodejs.orgNode.js 提供了一系列内置模块，这些模块提供了许多常用的功能。内置模块无需额外安装，直接可以在代码中引入使用。本文将介绍几个常用的 Node.js 内置模块及其常见方法。
2024-11-28 14:55:25
1003
原创 React之组件渲染性能优化
下面对React.memo和useMemo特性React.memouseMemo主要功能缓存组件，防止不必要的渲染缓存回调函数缓存计算结果使用场景当传入的 props 没有变化时，避免组件重新渲染传递函数到子组件时，避免重新渲染时重新创建该函数避免在每次渲染时，进行不必要的昂贵计算依赖项根据 props 变化根据依赖数组变化根据依赖数组变化返回值类型返回新的组件返回记忆化的函数返回记忆化的值。
2024-10-16 17:29:59
1112
原创 exports, module.exports和this 同时设置，最终导出的是什么
exports和 module.exports是用来定义模块的导出内容。exports是的一个引用，但如果被重新赋值，exports的引用将被忽略。this在模块文件的顶层上下文中，指向。在模块开始时，thisexports和是同一个对象的引用。但重新赋值时指向一个新的对象，exports和this仍然指向旧对象。：最终决定模块导出的内容。在这个示例中，它会被设置为exports.c和this.m都不会影响到最终的导出。：不会生效，因为已经被重新赋值了。this.m = 5：也不会影响最终的导出，因为。
2024-09-05 19:15:00
527
原创 React原理之Diff算法
Diff 算法是 React 中最核心的部分，它决定了 React 在更新时如何高效地复用和更新 FiberNode。前面我们提到：在构建 workInProgress Fiber Tree 时会尝试复用 current Fiber Tree 中对应的 FiberNode 的数据，这个决定是否复用的过程就是 Diff 算法。除了和JSX，即类组件的 render 方法的返回结果，或函数组件的调用结果。JSX 对象中包含描述DOM 节点的信息。Diff 算法的本质就是。
2024-08-28 18:03:27
2504
原创 React原理之Fiber双缓冲
双重缓冲是一种渲染优化技术，其使用来管理渲染，即和。当前树代表屏幕上当前显示的内容，而工作树用于准备下一次的渲染更新，用以实现平滑的更新。本篇将详细介绍 Fiber 架构的工作原理
2024-08-17 10:27:30
1455
原创 React原理之Fiber详解
Fiber 节点是 Fiber 架构的核心概念之一，它是一种虚拟 DOM 的实现方式。Fiber 本质上是一个对象， 使用了。双重缓冲是一种渲染优化技术，其使用来管理渲染，即和。当前树代表屏幕上当前显示的内容，而工作树用于准备下一次的渲染更新，用以实现平滑的更新。
2024-08-17 10:13:25
1398
原创 React原理之React整体渲染流程
上一篇这三个组件共同工作提供了 React 的高效和灵活的渲染机制，那么他们具体是怎么渲染的呢？React 的渲染流程分为两个阶段：- render 阶段：Reconciler 的工作阶段，这个阶段会调用组件的 render 方法- commit 阶段：Renderer 的工作阶段，可以类比 git commit 提交，这个阶段会渲染具体的 UI。
2024-08-09 10:24:20
1760
原创 React原理之React整体架构解读
了解 React 的多少都见过这句话：React16 之后，改用了。那么，到底什么是 Fiber 架构？之前的架构是什么？为什么要使用 Fiber 架构代替之前的呢？其实关于 Fiber 架构的解读可深可浅，然而我曾经对 Fiber 架构的认知是 👇emmm 这个确实过于浅了。此篇文章作为我的学习记录，将概括性地总结讲述 Fiber 架构的关键概念。具体的深入内容将会在之后的文章中介绍。
2024-08-03 15:52:20
1653
1
原创 React Context：贯穿React应用的共享状态线
在 React 应用中，"context" 是一种特殊的全局状态管理机制。它允许你在组件树中传递数据，而不需要手动逐层传递 props。Context为整个组件树提供数据，Context 会穿过中间的任何组件
2024-07-29 17:45:56
823
原创 mapbox关于创建地图和添加标记点的踩坑记录
最近用到了mapbox，虽然都是简单功能，但是好像国内用mapbox的并不多，再加上没有中文文档，一不小心就踩坑…
2024-07-22 20:33:56
1378
原创 React.createRef、useRef、React.forwardRef与useImperativeHandle
在这篇文章中，我们将从基础的`ref`概念开始，逐步深入到`useRef`的使用，探索如何通过`React.forwardRef`将`ref`传递给子组件，以及如何使用`useImperativeHandle`来处理一些需要直接操作DOM的场景。
2024-07-18 00:45:00
2390
原创 Webpack——分包（自动分包和手动分包）
Webpack的分包机制主要是通过代码分割（code splitting）来实现，简单来说，就是将一个完整的代码，分布到不同的打包文件中。分包的目的是通过降低总体积和利用浏览器缓存，来优化Web应用的加载性能和资源利用率。
2024-07-15 07:45:00
4460
原创 webpack——plugin的结构及其应用
📚上篇文章分析了loader的运行过程。loader的功能定位是进行预处理转换代码，而另外一些操作需要依靠plugin来完成。先看plugins在官网中的定义老规矩，提炼一下意思，大致就是说。具体是什么事呢？举个例子： 当webpack生成文件时，顺便多生成一个说明描述文件。这种操作其实就是通过plugin，把某些功能嵌入到webpack的编译流程中。
2024-07-13 09:15:00
1347
原创 loader的运行过程
🕵️♂️前面两篇分析了webpack的编译结果和编译过程，可以看出，webpack做的事情，仅仅是分析出各种模块的依赖关系，然后形成资源列表，最终打包生成到指定的文件中。🌟而更多的功能需要借助webpack loaders和webpack plugins完成。loader 用于对模块的源代码进行转换。loader 可以使你在import或 “load(加载)” 模块时预处理文件。因此，loader 类似于其他构建工具中“任务(task)”，并提供了处理前端构建步骤的得力方式。
2024-07-12 08:00:00
651
原创 Webpack——编译结果简化分析
为了更好地学习Webpack的工作原理，本文将从一个实际的角度出发，对编译结果进行简化分析。本文将以两个基础模块为例，模拟一个简化的编译结果，将编译结果中的每个部分逐一拆解，用浅显的语言解释其作用和意义。
2024-07-09 20:30:00
1052
原创 Webpack(2)——安装和使用
webpack是基于模块化的打包（构建）工具，它把一切视为模块。它通过一个开发时态的入口模块为起点，分析出所有的依赖关系，然后经过一系列的过程（压缩、合并），最终生成运行时态的文件。如上图，左边我们写的代码不是交给node或者浏览器执行，而是交给webpack打包成最终的文件，最终的文件才会交给浏览器或者node去执行。最终的文件不是CommonJS也不是ES6模块化，而是一个普通函数，所以它可以是通用的。
2024-07-08 07:15:00
448
原创 Webpack(1)——为什么要使用构建工具
在node端，运行的JS文件在本地，因此可以本地读取文件，它的效率比浏览器远程传输文件高的多其实根本原因在于：在浏览器端，开发时态（devtime）和运行时态（runtime）的侧重点不一样这种差异在小项目中表现的并不明显，可是一旦项目形成规模，就越来越明显。
2024-07-06 14:38:51
212
原创 Webpack之Babel的运行过程和使用
Babel是一个，它是独立的，可以在webpack外使用。Babel和Webpack各自负责不同的任务，它们可以可以协同工作来优化和构建现代JavaScript应用。Babel 是一个工具链，主要用于将采用 ECMAScript 2015+ 语法编写的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中。
2024-06-27 20:24:37
1023
原创 很久之前的微信小程序授权流程记录
在微信小程序中，打开摄像头、麦克风，获取地理位置等接口，都需要经过授权才能调用，详见。既然每次都需要授权，那我每次使用前调用一次 wx.authorize不就得了？第一次调用时，出现了令人激动的绿色弹框！手抖点了拒绝，尝试再次点击（调用时），发现没反应了？？？仔细阅读了官方文档，发现了这句话如果用户之前已经同意授权，则不会出现弹窗，直接返回成功。那么如果之前拒绝授权呢？没说，但实操发现也不会出现弹框。
2024-06-24 15:45:24
1052
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人