skip to content
OnionTalk

Posts

  • 使用yeoman创建属于你自己的脚手架

    现代前端开发,由于构建工具的大规模使用,项目的配置趋于日渐复杂。很多时候你只是需要快速编写一个简单的demo,但是你首先需要做的可能是花费不少的时间搭建一整套的前端工具链。为了解决这个问题,社区创造出了不少比较成熟的脚手架或者boilerplate来让开发者快速搭建项目。但是如果你想快速的定制化属于你自己的脚手架,今天要聊的yeoman可能是一个不错的选择。
  • Deep In React (四) stack reconciliation

    在前一篇文章中我们谈到了DOM diff的基石,Internal Instance。同时我们也留下了一些悬而未解解的问题,比如Internal Instance到底有什么更进一步的应用。在这篇文章中,我们来了解一下基于Internal Instance的stack reconciliation(DOM Diff算法)
  • Deep In React (三)Internal Instance

    在上一篇文章中我们谈到了React的递归式渲染这个名词,那么一个React element经过了怎样的变化最后映射成了对应的DOM结构,Reacte element又是怎样在DOM树中挂载/卸载的?这篇文章会带你一探究竟。
  • Deep In React (二) Component,Element和渲染

    在上一篇文章中,我们谈到了如何从应用层面优化React的性能,在随后的几篇文章中,我们将深入React的底层实现,仔细分析一下为什么React会有如此高的性能。在介绍React底层的reconciliation算法之前,我们需要先了解一些先导知识。
  • 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。