Deep In React (一) 高性能React组件

React在推向社区之初, 一个备受社区欢迎的点就是React的优秀的性能。得益于React出色的架构, React相比于传统的方式确实快很多。但是在实际开发中也存在着很多React性能的陷阱。虽然我们绝大多数时候其实不需要过于关心React的性能问题,但是当需要提升性能时,我们也会有一些很好的切入点去做这件事情.

阅读全文

使用Typescript给JavaScript做静态类型检查

TypeScript,作为JavaScript的超集,给JavaScript带来了强类型这个非常强大的特性,给前端的开发以及重构带来了很大的便利性。但是,即使TypeScript现在已经可以直接使用用JavaScript编写的模块了,有很多遗留项目想要立马迁移到TypeScript也并非易事。但是好消息是,TypeScript在2.3版本引入了Js Type Checking,从此,不需要任何对于已有代码的侵入,你也可以很好的享受TypeScript带来的一些特性了。

阅读全文

使用Yarn Workspace管理多project repo

node的包管理方式和js社区重复造轮子的坏习惯一直为人所诟病。Yarn的横空出世很好的解决了单个package.json之下依赖重复的问题。对于多个package.json的项目,有没有办法解决呢?答案是Yes,Yarn workspace能很好的帮你做到这一点。

阅读全文

使用Jest进行Javascript单元测试

有人觉得,单元测试这玩意儿一直是个玄学,尤其是前端的单元测试。后端单元测试至少还能起到验证业务逻辑的作用,但是在传统的 Web 项目中,前端的主要作用只是简单的输出页面 UI,并附加一些命令式的交互绑定。总而言之,前端既难以测试(因为绝大多数命令式的代码和 DOM 强绑定,很难使用单元测试独立出来),又没有太大的必要去测试。 但是随着技术的发展,类似 React、Angular 这种大型的 UI 框架如雨后春笋般冒出来并且被越来越多的人开发者所接受。打开一个最近流行的前端项目,你会发现前端项目的复杂度已大大超过以前,前端也开始承担越来越多的业务逻辑。于此同时,由于大型 UI 框架的使用,前端代码也变得越来越声明式,意味着其可测性变得越来越好。重新审视我们的前端单元测试,我们会发现其重要程度已经不亚于后端的单元测试。 说到前端测试框架,市面上其实已经有了 Jasmine/Mocha 这种成熟的测试框架,但是今天我们更多的来聊聊 Jest。

阅读全文