状态管理本应如此简单

2021-05-19
阅读 2 分钟
3.1k
2021年520前夕。近一年来主要都在做业务,不过对不断提升Coding质量与速度的追求和思考一直没停过。机缘巧合之下,有幸着重花时间完善了一套稳定、易用的状态管理方案。
封面图

轻松掌握React Hooks底层实现原理

2020-12-31
阅读 3 分钟
12.5k
由于最近业务较忙,2020年搞懂React原理系列文章最终篇直到现在才在业余时间抽空完成。之前在公司内部已有过一次PPT形式的分享,但经过一段时间对hooks的深度使用,对其又有了更深一些了解,故本次加上新内容并以文章形式再分享一次。

另辟蹊径搭建阅读React源码调试环境-支持所有React版本细分文件断点调试

2020-06-21
阅读 3 分钟
6.4k
若要高效阅读和理解React源码,搭建调试环境是必不可少的一步。而常规方法:使用react.development.js和react-dom.development.js调试,虽然方便,但无法知道每段代码属于哪个细分文件,所以本文将介绍一种取巧的方法搭建便于调试React源码的环境,支持断点调试细分文件,并且此方法理论上可应用于所有Reat版本。

彻底搞懂React源码调度原理(Concurrent模式)

2020-05-11
阅读 19 分钟
6.5k
自上一篇写关于diff的文章到现在已经过了二十天多,利用业余时间和10天婚假的闲暇,终于搞懂了React源码中的调度原理。当费劲一番周折终于调试到将更新与调度任务连接在一起的核心逻辑那一刻,忧愁的嘴角终于露出欣慰的微笑。

搞懂React源码系列-React Diff原理

2020-04-09
阅读 6 分钟
3.6k
时隔2年,重新看React源码,很多以前不理解的内容现在都懂了。本文将用实际案例结合相关React源码,集中讨论React Diff原理。使用当前最新React版本:16.13.1。

轻松学会HTTP缓存(强缓存,协商缓存)

2020-03-30
阅读 2 分钟
5.7k
若读者对“强缓存”,“协商缓存”字眼非常熟悉,但又不知道他们具体是什么,亦或有读者还不了解HTTP缓存,那么本文将为读者一一讲解。 欢迎Star和订阅我的博客。 HTTP缓存流程 在介绍什么是强缓存、协商缓存前,让我们先了解HTTP缓存的流程,因为强缓存、协商缓存只是其中2步。 强缓存 “检查缓存是否过期”一步即强缓存。若...

看完Webpack源码,我学到了这些

2020-01-15
阅读 4 分钟
8.6k
继React,Vue,这是第三个着重阅读源码的前端项目-Webpack。本文主要以: WHY: 为何要看Webpack源码 HOW: 如何阅读Webpack源码 WHAT: 看完源码后学到了什么 三个方向展开。 欢迎Star和订阅我的博客。 WHY 诚然Webpack这是一个前端工程化工具,理解容易, 使用简单,似乎没有深入研究的必要。那为什么还要费心费力阅读其源...

记一次前端项目重构要点总结

2019-07-04
阅读 3 分钟
5.5k
不知不觉已是2019年的7月,恍惚之间已工作四年。懵懵懂懂的成长,间歇性努力,实话说,对现在自己取得的成果不大满意。不过,好在时不时顿悟,知道适时作出改变。

使用React手写一个对话框或模态框

2019-04-24
阅读 2 分钟
6.9k
核心在于使用React的接口React.createPortal(element, domContainer)。该接口将element渲染后的DOM节点嵌入domContainer(通常是document.body),并保证只嵌入一次。

节流 - 理解,实践与实现

2019-04-02
阅读 2 分钟
3.2k
节流(分流),与防抖(去抖)实现原理相似。本文主要讨论节流,镜像文章:防抖 - 理解,实践与实现。分开讨论防抖和节流,主要是为了让一些还不太了解节流防抖的读者能够有针对性地,逐一掌握它们。 如何用代码实现节流也是一个要点。本文采用循序渐进地方式,先绘制一个案例的流程图,再根据流程图的逻辑编写节流功能代码。

前端动画演绎排序算法

2019-03-28
阅读 2 分钟
4k
文章包含多个可交互案例,可通过博客原文实时查看案例 在学习了常用的排序算法之后,打算用动画Demo来生动形象的展现它们。 这里包含6种排序算法,其中一半是简单算法,另一半是高级算法: 冒泡排序 选择排序 插入排序 ~ 归并排序 希尔排序 快速排序 冒泡排序 这可能是最简单的一种,但是速度非常慢。 假设我们按照棒球运...

揭开redux,react-redux的神秘面纱

2018-12-18
阅读 4 分钟
2.3k
16年开始使用react-redux,迄今也已两年多。这时候再来阅读和读懂redux/react-redux源码,虽已没有当初的新鲜感,但依然觉得略有收获。把要点简单写下来,一方面供感兴趣的读者参考,另一方面也是自己做下总结。

防抖 - 理解,实践与实现

2018-09-21
阅读 3 分钟
5.3k
防抖(去抖),以及节流(分流)在日常开发中可能用的不多,但在特定场景,却十分有用。本文主要讨论防抖,镜像文章:节流 - 理解,实践与实现。分开讨论防抖和节流,主要是为了让一些还不太了解防抖节流的读者能够有针对性地,逐一掌握它们。 防抖有两种模式(容易让人迷惑):延时执行和直接执行。后续详细讨论。 防抖...

不再手写import - VSCode自动引入Vue组件和Js模块

2018-07-19
阅读 2 分钟
20.8k
如要自动引入Vue组件,首先需安装VSCode拓展: Vetur 自动引入Vue组件和普通Js模块 在根目录添加 jsconfig.json 。 每次修改jsconfig.json后需重启该VSCode窗口 {代码...} 支持Webpack别名路径 同上,需更新 jsconfig.json {代码...} 在JS中自动引入node_modules中的JS 以lodahs为例,安装 lodash: npm install lodash ...