- 博客(66)
- 收藏
- 关注
RSS订阅原创 React-useEffect的闭包陷阱(stale closure)
【代码】React-useEffect的闭包陷阱(stale closure)
2025-07-21 21:52:07
318
原创 事件循环(Event Loop)
具体做法是当某些任务发生时，比如计时器、网络、事件监听，主线程将任务交给其他线程去处理，自身立即结束任务的执行，转而执行后续代码。如果使用同步的方式，就极有可能导致主线程产生阻塞，从而导致消息队列中的很多其他任务无法得到执行。JS是一门单线程的语言，这是因为它运行在浏览器的渲染主线程中，而渲染主线程只有一个。而渲染主线程承担着诸多的工作，渲染页面、执行 JS 都在其中运行。在这种异步模式下，浏览器永不阻塞，从而最大限度的保证了单线程的流畅运行。，加入到消息队列的末尾排队，等待主线程调度执行。
2025-05-29 13:44:28
933
原创 React fiber架构中 优先级是如何确定的?
React Fiber通过综合考虑任务的类型、紧急程度、用户行为、系统性能等多种因素，动态地确定和调整任务的优先级。这种优先级调度机制使得React能够更加智能地管理任务的执行顺序，在保证用户交互体验的同时，充分利用系统资源，提高应用的整体性能和响应速度。
2025-02-20 15:50:55
669
原创 micro-memoize 缓存计算结果
记忆化是一种优化技术，通过存储复杂计算的结果并在后续计算中重用这些结果，来避免不必要的重复计算。这意味着，一旦某个特定的输入（或一组输入）被传递给被记忆化的函数，其计算结果就会被存储起来，并在未来的调用中直接返回这个存储的结果，而不是重新执行整个计算过程。例如，假设你有一个计算斐波那契数列的函数，这个函数对于较大的输入值可能会非常慢，因为它会进行大量的重复计算。简而言之，micro-memoize 的作用是通过记忆化技术来优化函数执行，避免不必要的重复计算，从而提高程序的整体性能。
2024-10-14 22:55:19
427
原创 前端地图数据开发
基于Turf.js教你快速实现地理围栏的合并拆分。turf js 地理空间分析库，处理各种地图算法。如何拆分一个乡镇或区的地图。获取市级的行政区域划分。直接导入地图的json。高德地图查看市级区域。js实现地图区域合并。
2024-10-13 18:47:07
521
原创 为什么Vue3双向绑定使用Proxy
一文搞懂Object.defineProperty和Proxy，Vue3.0为什么采用Proxy？vue 3.0 Proxy的使用
2024-01-29 09:37:45
613
原创 变动观察器 MutationObeserver Web API
MutationObserverMutationObserver.observe()config的配置项定义DOM 规范中的 MutationObserver() 构造函数——是 MutationObserver 接口内容的一部分——创建并返回一个新的观察器，它会在触发指定 DOM 事件时，调用指定的回调函数。MutationObserver 对 DOM 的观察不会立即启动；而必须先调用 observe() 方法来确定，要监听哪一部分的 DOM 以及要响应哪些更改。 var observer
2022-04-11 20:56:08
306
1
原创 forEach中的await的执行顺序 与 for of等的区别
forEach中 异步任务的执行顺序.先看代码<script> let promiseTask = (num) => { return new Promise((resolve, reject) => { setTimeout(() => { console.log(num * num); resolve(true); }, 1000)
2022-03-10 22:16:14
6407
原创 跨页面通信
同源页面间的跨页面通信BroadCast Channel// 发送广播const bc = new BroadcastChannel('flashPage'); bc.postMessage({ msg: 'flashPage', from: 'index.js',});// 监听广播const bc = new BroadcastChannel('flashPage'); bc.onmessage = (e) => { const data =
2022-01-13 09:49:49
379
原创 单页面路由实现原理-hash
前端开发中的路由,其实就是操作url地址改变浏览器地址内容区切换内容hash的特点改变url的时候, 不会刷新页面当 一个窗口的 hash （URL 中 # 后面的部分）改变时就会触发 hashchange 事件（location.hash）。hashchange 用它来监听url路径变化实现一个最简单的hash单页应用事件委托window.location.hash改变hashchange事件监听改变页面内容<!DOCTYPE html><html
2021-11-10 23:42:16
939
原创 Map与 WeakMap 及WeakMap的主要作用
概念ES6 提供了 Map 数据结构. 它类似与对象,也是键值对的集合. 但是 ‘键’ 的范围不限于字符串,各种类型的值(包括对象) 都可以当作键. Map 也实现了 Iterator接口, 所以可以使用 扩展运算符 和 for...of... 进行遍历.Map 键值对的集合是 对 键去重. 值可以是重复的.Map 的属性和方法如果存在相同的键，则会按照FIFO（First in First Out,先进先出）原则，后面的键值信息会覆盖前面的键值信息。1. size属性: 返回Map的元素的
2021-11-10 22:36:22
683
学前教育幼师职业发展规划：基于自我与环境分析的短期考证与长期管理路径设计
2025-11-20
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人