牧云云

deku | 拼多多

I like programming, music, surfing internet, playing games, and I love making friends very much.

35关注

6,066关注者

赞

306

更多

文章

4月前

SEO 在 SPA 站点中的实践

本文从 SPA 站点实现 SEO 作为切入点, 先后介绍了 SEO 的基本原理, SEO 在 SPA 站点中的 4 种实践案例, 并结合 create-react-doc SPA 框架进行完整的 SEO 实践。观察基于 create-react-doc 搭建的文档站点, 发现…

694
19
2

1年前

create-react-doc — 基于 React 的文档站点生成工具

Create React Doc 是一个使用 React 的 markdown 文档站点生成工具。就像 create-react-app 一样，开发者可以使用 Create React Doc 来开发、部署 markdown 站点或者博客而无需关心站点环境配置信息。建站理念:…

616
7
3

1年前

组件设计 —— 重新认识受控与非受控组件

React 官网中对非受控组件与受控组件作了如图中下划线的边界定义。一经推敲, 该定义是缺乏了些完整性和严谨性的, 比如针对非表单组件(弹框、轮播图)如何划分受控与非受控的边界? 又比如非受控组件是否真的如文案上所说的数据的展示与变更都由 dom 自身接管呢? 在非受控组件中,…

966
14
7

1年前

React 现代化测试

测试用例的书写是一个风险驱动的行为, 每当收到 Bug 报告时, 先写一个单元测试来暴露这个 Bug, 在日后的代码提交中, 若该测试用例是通过的, 开发者就能更为自信地确保程序不会再次出现此 bug。前端测试中有两种模型, 金字塔模型与奖杯模型。金字塔模型自下而上分为单元…

1285
14
5

2年前

React Hooks 深入系列 —— 设计模式

本文是 React Hooks 深入系列的后续。此篇详细介绍了 Hooks 相对 class 的优势所在, 并介绍了相关 api 的设计思想, 同时对 Hooks 如何对齐 class 的生命周期钩子作了阐述。 React 的 logo 是一个原子图案, 原子组成了物质的表现。…

2135
23
1

2年前

如何使页面交互更流畅

本篇是基于 FDCon2019 上《让你的网页更丝滑by刘博文》的复盘文。该课题也是博主感兴趣的领域, 后续会结合 React 的 Schedule 与该文进行进一步整合。当前市面上的设备频率在 60 HZ 以上。结合如下代码块, 可以看到 100ms 以下的点击是顺畅的,…

2511
51
3

2年前

React Hooks 深入系列

在以下 demo 中, useEffect 的第二个参数传入 [], 希望的是 useEffect 里的函数只执行一次(类似在 componentDidMount 中执行一次, 但是注意这里仅仅是类似, 详细原因见上一条注意项), 页面上每隔 1s 递增 1。但这样达到我们预…

2457
45
3

2年前

你不知道的 requestIdleCallback

本文副标题是 Request Schedule 源码解析一。在本章中会介绍 requestIdleCallback 的用法以及其缺陷, 接着对 React 团队对该 api 的 hack 部分的源码进行剖析。在下一篇中会结合优先级对 React 的调度算法进行宏观的解释。 Re…

1991
36
6

2年前

深度理解 React Suspense

本文介绍与 Suspense 在三种情景下使用方法，并结合源码进行相应解析。在 16.6 版本之前，code-spliting 通常是由第三方库来完成的，比如 react-loadble(核心思路为: 高阶组件 + webpack dynamic import), 在 16.…

1.5w
111
5

2年前

React Fiber 数据结构揭秘

此章节会通过两个 demo 来展示 Stack Reconciler 以及 Fiber Reconciler 的数据结构。首先用代码表示上图节点间的关系。比如 a1 节点下有 b1、b2、b3 节点, 就可以把它们间的关系写成 a1.render = () => [b1, b…

1582
22
3

个人成就

掘金优秀作者

文章被点赞4,495

文章被阅读157,237

加入于

2016-11-16