目标

  1. 使用 RollupTypeScript 构建三个工具包,分别为:仅支持浏览器环境(使用了 BOM、DOM)、仅支持 nodejs 环境(使用了 nodejs API)、纯 JavaScript 环境;
  2. 自动生成 *.d.ts 文件,使用 @microsoft/api-documenter、 @microsoft/api-extractor 生成 API Doc;
  3. 加入 Jest 测试工具,测试覆盖率达标后方可发包;
  4. 使用 Lerna 进行多 package 管理与 npm 发布。
阅读全文 »

2019 年我第一次在生产项目里用 React Native,当时的版本还是 0.59,光是环境搭建就花了两天。现在 RN 已经迭代到了新架构(Fabric + TurboModules + JSI),底层的 Bridge 通信模型被彻底替换,但核心的设计思路——“Learn once, write anywhere”——一直没变。

这篇文章从移动端跨平台方案的演进讲起,然后拆解 RN 的原理,最后给一个自定义 Renderer 的最小实现,帮你理解 React 是怎么把自己”嫁接”到不同平台上的。

阅读全文 »

用了几年 react-router,从 v4 的动态路由到 v6 的嵌套路由,API 变了好几轮。但翻开源码会发现,不管外层怎么变,核心机制始终是三件事:监听 URL 变化、匹配路由表、渲染对应组件。

这篇文章从 v6 的用法讲起,然后拆解 BrowserRouterRouteshistory 库的源码链路,最后对比 react-router 和 vue-router 在实现上的关键差异——如果你需要在一个项目里同时用这两个框架,这些差异值得提前知道。

阅读全文 »

团队开始写第二个项目的时候,组件库的需求会自然冒出来——“这个按钮上个项目写过,拷过来”、”那个表单校验逻辑别重新写了”。拷来拷去几次之后,你意识到需要一个正经的组件库了。

但”写一个组件库”和”写一个好用的组件库”之间的差距,比想象中大得多。除了把组件写出来,你还需要处理文档、构建、测试、版本管理、代码规范——每一件事单独看都不难,放在一起就是一套工程体系。

这篇文章梳理的是我搭建一个 React 组件库时踩过的坑和最终沉淀下来的选型。

阅读全文 »

如果你问一个 React 面试题:”setState 之后发生了什么?”,标准答案应该是——React 创建 update 对象、调度更新、经过 reconciler 的 diff 过程、最后 commit 到 DOM。但如果追问:”reconciler 是怎么遍历 Fiber 树的?diff 算法的 O(n) 是怎么做到的?”,能回答清楚的人就少很多了。

这篇文章从 React 源码的调用链路出发,追溯从 ReactDOM.render 到真实 DOM 更新的完整过程。重点放在两个核心机制上:Fiber 架构为什么要替代 Stack Reconciler,以及 diff 算法做了哪些假设把复杂度从 O(n³) 降到 O(n)。

阅读全文 »

HOC、Hooks、异步组件、React 18——这四个话题放在一起,因为它们代表了 React 在不同阶段对”组件逻辑复用”这个问题的答案。

高阶组件(HOC)是 Class 组件时代的解决方案。Hooks 出现后,大部分 HOC 的场景被取代了,但 HOC 的设计思想——组合优于继承——仍然是理解 React 的关键。异步组件解决的是代码体积问题,React 18 的 Concurrent Mode 则是在渲染模型层面动了刀。

阅读全文 »

React 入门:从 MV* 到组件化

React 是一个声明式的 JavaScript 库,用于构建用户界面。它的核心公式很简单:UI = render(data)——数据单向流动,你描述 UI 应该长什么样,React 负责把它渲染出来。

但在理解 React 之前,有必要先搞清楚它试图解决什么问题。我们来从 MVC 和 MVVM 这两种经典模式说起。

阅读全文 »

你一定用过”微信登录”或”Google 登录”。点一下按钮,第三方应用就拿到了你的头像和昵称——但你从来没有把微信密码告诉过它。这是怎么做到的?

答案就是 OAuth 2.0。它不是什么新东西,2012 年就发布了 RFC 6749,但直到今天仍然是互联网授权的事实标准。

阅读全文 »

本文转载自龙爪槐守望者微博

软/硬件特性

首屏

根据用户手机分辨率,考虑哪些信息必须首屏展示

系统和平台差异

注意系统差异,例如 Android picker 风格、返回机制、手势等
考虑小程序某些效果是否能实现

新老版本共存

新增功能时,对老版本的影响

阅读全文 »
0%