分类: frontend

前端工程体系

我常常执着于部分(比如昏天暗地地解读一个源码),不能跳出来看看整体。这篇文章旨在于整理我所理解的前端工程体系,方便逐步演进顶层观念并指导后续发展。因为见识的有限和理解的不足,这篇文章本难免缺陷和差缪,还望有识予以理解。 我所理解的前端工程体系大致如上图。左半部分以 antd + umi、fusion + 飞冰为参照加以说明,组件库用于提供基础的通用组件。模板工程通常提供了应用层面的最佳实践,因此

前端技术汇总贴

下载立即收藏!这应该是你见过的最全前端下载总结 校验身份证号根据〖中华人民共和国国家标准 GB 11643-1999〗中有关公民身份号码的规定,公民身份号码是特征组合码,由十七位数字本体码和一位数字校验码组成。排列顺序从左至右依次为:六位数字地址码,八位数字出生日期码,三位数字顺序码和一位数字校验码。 地址码表示编码对象常住户口所在县(市、旗、区)的行政区划代码。 出生日期码表示编码对象出生的年

react fiber 代码梳理篇

scheduleWork正如 react fiber 搜罗整理篇 已点明的,fiber reconciler 对首次渲染和再次渲染会采用不同的机制。 首次渲染 —— 比如用户侧在浏览器环境调用 ReactDOM.render(rootReactElement, rootDomElement) —— 时,fiber reconciler 首先会通过 createContainer 将根节点 roo

图片校验码

纯前端实现纯前端实现图片校验码指的是通过 canvas 绘制随机串的方式。这种方式有极大的弊端:如果随机串在前端生成,那么通过拦截伪造请求仍然能正常调用后台接口;如果随机串由后台发送给前端,那么中间可以被拦截并伪造(当然,可尝试用加密技术进行保护)。因此,这种方式大体适用于学习研究的目的。以下代码段基于 react 验证码组件 整理,其实现也可以参考 在React中随机生成图形验证码。您可以在 c

react fiber hooks钩子篇

前言本文浅述了 react hooks 的执行机制,但在 expirationTime 优先级处理、suspenseConfig 配置、side-effects 执行机制、useContext、useTransition、useResponder 等方面显得力有不逮,并且未采用图文描述的形式。个中错谬,仍需勘正。 react hooks 的使用可参考 React Hooks的体系设计之一 - 分层

react fiber 类组件状态更新篇

前言本文仅在局部层面上解释类组件的状态更新机制,并没有对函数组件的 hooks、fiber 优先级等作说明。 Update 及 UpdateQueueUpdatefiber reconciler 将 fiber 的状态更新抽象为 Update 单向链表: tag:更新类型,UpdateState、ReplaceState、ForceUpdate、CaptureUpdate payload:状态变

js 事件循环

事件循环基本js 是一门单线程非阻塞脚本语言。即便浏览器推出的 web worker 也只允许子线程承担计算任务,而不能操纵 dom 节点(因为主、子线程同时操纵 dom 会造成不一致)。 执行栈可用于解释 js 引擎对同步脚本的处理。即当函数首次被调用时,js 引擎就会为该过程创建执行上下文,并将该执行上下文压入执行栈中。执行上下文也称为执行环境,包含函数的私有作用域、父级作用域、参数、作用域中

react scheduler 再解析篇

顾名思义,scheduler 用于完成调度工作。 主流程任务队列scheduler 使用 Heap 堆存放任务队列。每个任务在进入 Heap 堆前,会根据 sortIndex、id 属性进行优先级排序。它首先比较 sortIndex 值,值越小,优先级越高;其次以相同的规则比较 id(即比较任务的创建顺序)。依循优先级的高低,scheduler 采用位运算取中位节点的方式交换任务在 Heap 堆中

聊聊 Ant Design 组件库的构成

底层功能组件rc-utilKeyCode: 记录了各按键的编码,并提供按键判断工具。 hooksuseMergedState(defaultStateValue, option) 主要用于表单项的 value 值状态处理,也可以用于其他状态处理。逻辑上,首先以 option.value、option.defaultValue、defaultStateValue 的顺序设置内部 value 状态值,

react fiber 搜罗整理篇

fiber 出台的原委和特性The crux of the change is transitioning from processing updates in a synchronous, recursive way to relying on asynchronous scheduling and prioritization of interface changes. A look insi