扩大
缩小

随笔分类 -  React

1 2 下一页
SEO 在 SPA 站点中的实践
摘要：背景 观察基于 create-react-doc 搭建的文档站点, 发现网页代码光秃秃的一片(见下图)。这显然是单页应用 (SPA) 站点的通病 —— 不利于文档被搜索引擎搜索 (SEO)。 难道 SPA 站点就无法进行 SEO 了么, 那么 Gatsby、nuxt 等框架又为何能作为不少博主搭建博 阅读全文
posted @ 2021-03-08 10:27 牧云云 阅读(325) 评论(0) 推荐(0)
组件设计 —— 重新认识受控与非受控组件
摘要：<! more 重新定义受控与非受控组件的边界 "React 官网中" 对非受控组件与受控组件作了如图中下划线的边界定义。一经推敲, 该定义是缺乏了些 和`严谨性`的, 比如针对非表单组件(弹框、轮播图)如何划分受控与非受控的边界? 又比如非受控组件是否真的如文案上所说的数据的展示与变更都由 dom 阅读全文
posted @ 2019-11-23 18:49 牧云云 阅读(472) 评论(0) 推荐(1)
React 现代化测试
摘要：测试的动机 测试用例的书写是一个风险驱动的行为, 每当收到 Bug 报告时, 先写一个单元测试来暴露这个 Bug, 在日后的代码提交中, 若该测试用例是通过的, 开发者就能更为自信地确保程序不会再次出现此 bug。 测试的动机是有效地提高开发者的自信心。 前端现代化测试模型 前端测试中有两种模型, 阅读全文
posted @ 2019-08-25 09:43 牧云云 阅读(1049) 评论(0) 推荐(0)
React Hooks 深入系列
摘要：本文基于近段时间对 hooks 碎片化的理解作一次简单梳理, "个人博客" 。同时欢迎关注基于 hooks 构建的 UI 组件库 —— "snake design" 。 在 class 已经融入 React 生态的节点下, React 推出的 Hooks 具有如下优势: 更简洁的书写; 相对类中的 阅读全文
posted @ 2019-05-12 13:38 牧云云 阅读(1128) 评论(1) 推荐(0)
你不知道的 requestIdleCallback
摘要：本文副标题是 。在本章中会介绍 的用法以及其缺陷, 接着对 React 团队对该 api 的 hack 部分的源码进行剖析。在下一篇中会结合优先级对 React 的调度算法进行宏观的解释, 欢迎关注 "个人博客" 。 与 这个 api 息息相关。 的作用是是在浏览器一帧的剩余空闲时间内执行优先度相对 阅读全文
posted @ 2019-03-23 20:49 牧云云 阅读(1385) 评论(0) 推荐(0)
深度理解 React Suspense(附源码解析)
摘要：本文介绍与 在三种情景下使用方法，并结合源码进行相应解析。欢迎关注 "个人博客" 。 Code Spliting 在 16.6 版本之前， 通常是由第三方库来完成的，比如 "react loadble" (核心思路为: 高阶组件 + webpack dynamic import), 在 16.6 版 阅读全文
posted @ 2019-03-05 00:12 牧云云 阅读(2360) 评论(0) 推荐(1)
React Fiber 数据结构揭秘
摘要：此章节会通过两个 来展示 以及 的数据结构。 "个人博客" 首先用代码表示上图节点间的关系。比如 下有 , 就可以把它们间的关系写成 ; Stack Reconciler 在 之前，节点之间的关系可以用数据结构中 来表示。 如下实现 函数, 将深度遍历的节点打印出来。 输出结果为: Fiber Re 阅读全文
posted @ 2019-02-23 21:48 牧云云 阅读(1204) 评论(0) 推荐(0)
React 特性剪辑(版本 16.0 ~ 16.9)
摘要：Before you're going to hate it, then you're going to love it. Concurrent Render(贯穿 16) 在 18年的 "JSConf Iceland" 上, Dan 神提到 Concurrent Render 涉及到 CPU 以及 阅读全文
posted @ 2018-12-05 22:17 牧云云 阅读(917) 评论(0) 推荐(1)
React16.x特性剪辑
摘要：本文整理了 React 16.x 出现的耳目一新的概念与 api 以及应用场景。 更多 React 系列文章可以订阅 "blog" 16.0 Fiber 在 16 之前的版本的渲染过程可以想象成一次性潜水 30 米，在这期间做不了其它事情(Stack Reconciler); 痛点概括: 一次性渲染 阅读全文
posted @ 2018-11-22 22:34 牧云云 阅读(414) 评论(0) 推荐(0)
打包优化实践(如何Code Spliting)
摘要：项目地址： "ReactSPA" 使用 webpack 插件找出占用空间较大的包 开发环境中可使用 "analyze webpack plugin" 观察各模块的占用情况。以该项目为例：浏览器中输入 可以看到如下效果: 按需加载 对模块结合 babel 进行 "按需加载" ; 测试 day.js 替 阅读全文
posted @ 2018-09-28 10:11 牧云云 阅读(687) 评论(0) 推荐(0)
从 0 到 1 实现 react - 9.onChange 事件以及受控组件
摘要：该系列文章在实现 cpreact 的同时理顺 React 框架的核心内容 "项目地址" 从一个疑问点开始 接上一章 "HOC 探索" 抛出的问题 ———— react 中的 onChange 事件和原生 DOM 事件中的 onchange 表现不一致，举例说明如下： 拨云见雾 我们来看下 React 阅读全文
posted @ 2018-09-18 16:29 牧云云 阅读(1032) 评论(0) 推荐(0)
从 0 到 1 实现 React 系列 —— 5.PureComponent 实现 && HOC 探幽
摘要：本系列文章在实现一个 cpreact 的同时帮助大家理顺 React 框架的核心内容(JSX/虚拟DOM/组件/生命周期/diff算法/setState/PureComponent/HOC/...) "项目地址" "从 0 到 1 实现 React 系列 —— JSX 和 Virtual DOM" 阅读全文
posted @ 2018-08-27 12:10 牧云云 阅读(551) 评论(0) 推荐(0)
从 0 到 1 实现 React 系列 —— 4.setState优化和ref的实现
摘要：看源码一个痛处是会陷进理不顺主干的困局中，本系列文章在实现一个 (x)react 的同时理顺 React 框架的主干内容(JSX/虚拟DOM/组件/生命周期/diff算法/setState/ref/...) "从 0 到 1 实现 React 系列 —— JSX 和 Virtual DOM" "从 阅读全文
posted @ 2018-08-05 23:35 牧云云 阅读(635) 评论(0) 推荐(0)
从 0 到 1 实现 React 系列 —— 3.生命周期和 diff 算法
摘要：看源码一个痛处是会陷进理不顺主干的困局中，本系列文章在实现一个 (x)react 的同时理顺 React 框架的主干内容(JSX/虚拟DOM/组件/生命周期/diff算法/setState/ref/...) "从 0 到 1 实现 React 系列 —— JSX 和 Virtual DOM" "从 阅读全文
posted @ 2018-07-27 09:05 牧云云 阅读(763) 评论(0) 推荐(2)
从 0 到 1 实现 React 系列 —— 2.组件和 state|props
摘要：看源码一个痛处是会陷进理不顺主干的困局中，本系列文章在实现一个 (x)react 的同时理顺 React 框架的主干内容(JSX/虚拟DOM/组件/...) 阅读全文
posted @ 2018-07-12 10:15 牧云云 阅读(513) 评论(0) 推荐(0)
从 0 到 1 实现 React 系列 —— 1.JSX 和 Virtual DOM
摘要：看源码一个痛处是会陷进理不顺主干的困局中，本系列文章在实现一个 (x)react 的同时理顺 React 框架的主干内容(JSX/虚拟DOM/...) 阅读全文
posted @ 2018-07-06 16:22 牧云云 阅读(842) 评论(0) 推荐(1)
redux middleware 源码分析
摘要："原文链接" middleware 的由来 在业务中需要打印每一个 action 信息来调试，又或者希望 dispatch 或 reducer 拥有异步请求的功能。面对这些场景时，一个个修改 dispatch 或 reducer 代码有些乏力，我们需要一个可组合的、自由增减的插件机制，Redux 借 阅读全文
posted @ 2018-03-01 00:43 牧云云 阅读(305) 评论(0) 推荐(2)
探索从 MVC 到 MVVM + Flux 架构模式的转变
摘要：本文首发于 "my blog" 在业务中一般 MVVM 框架一般都会配合上数据状态库(redux, mobx 等)一起使用，本文会通过一个小 demo 来讲述为什么会引人数据状态库。 从 MVC 到 MVVM 模式说起 传统 MVC 架构(如 JSP)在当今移动端流量寸土寸金的年代一个比较头疼的问题 阅读全文
posted @ 2018-02-11 15:39 牧云云 阅读(1126) 评论(0) 推荐(0)
[译]React 在服务端渲染的实现
摘要：原文地址： "Server Side React Rendering" 原文作者： "Roger Jin" <! more React 在服务端渲染的实现 React是最受欢迎的客户端 JavaScript 框架，但你知道吗(可以试试)，你可以使用 React 在服务器端进行渲染？ 假设你已经在 阅读全文
posted @ 2017-07-01 16:15 牧云云 阅读(4663) 评论(0) 推荐(2)
使用React全家桶搭建一个后台管理系统
摘要：引子 学生时代为了掌握某个知识点会不断地做习题，做总结，步入岗位之后何尝不是一样呢？做业务就如同做习题，如果‘课后’适当地进行总结，必然更快地提升自己的水平。 由于公司采用的react+node的技术栈，于是就完成了一个reactSPA小项目，计划日后把平时工作中遇到的业务以及学习中遇到有趣的东西给 阅读全文
posted @ 2017-05-12 10:10 牧云云 阅读(25545) 评论(21) 推荐(15)

1 2 下一页