前端夜点心

node 环境与浏览器环境的一个主要区别是 document 和 window 对象的缺失。尽管现代的前端开发中源码对 DOM 和 BOM 的直接操作往往非常有限，但在单元测试层面，他们的存在是必不可少的——可以用来重建一个特定的浏览器版本；用来还原一种特定的缓存状态；用来断言…

这样的类型推断策略在大部分的情形下比较通用，但在个别情形下会显得有些棘手。例如我们想实现一个 React 中的自定义 Hook。这个 Hook 能通过 Ref 维护一个状态。它的返回值与 useState 类似是一个元组：第一项是该状态的值，第二项是该状态的 setter 上面…

在这样的处境下，一味强调单元测试的逻辑覆盖率是没有太大意义的，明确在哪里应用单测的能取得最大的边际效益是更有意义的事情。 单测只是一种局部模块测试，是诸多测试方案中的一种，认识到这一点可以避免我们为了测试而测试，或者为了指标而测试。 同时也应该认识到单测本身的覆盖能力也是有限的…

今天的夜点心我们来聊聊 JS 项目中的单元测试。 近期会通过几篇夜点心来聊聊单元测试，这篇关于如何从工程层面让单测更易进行，之后会进一步讨论如何写测试脚本以及如何对组件进行单测。 所谓“单元”测试，就是为了验证一个模块（一个函数、一个类、一个组件）的功能是否符合预期所做的测试。…

通过位运算来定义和使用枚举型，可以实现把很多「是否」的属性压缩在一个字段中存储的效果。并且无论在生产端还是消费端，使用起来都还比较直观。 在数据传输层面，基于掩码来传输属性会大大压缩数据体积，加快传输。 但同时掩码也会带来一些问题，其一就是需要生产端配合实现。例如对来自后端的数…

CSS 的特性不断增强，预编译框架也层出不穷，但是即使使用 cssModules 这样的 scope 技术，我们仍需要一些范式来指导我们在局部更规范合理地给类取名字。 不同的范式的侧重不同，有些范式可以相互兼容组合，有些不能。他们大都是为了达成以下目标诞生的： OOCSS 提倡…

今天的夜点心，我们聊聊对前端架构的看法。 一个好的前端架构，应该没有明显的短板。知易行难，后续我们会分三个章节（Data、Domain、View）来聊聊怎么样组织前端工程； 平时 web 开发，不可避免的会进行 AJAX 接口的调用。常见的编写模式是：在每个页面需要调用数据的地…

开发中我们会遇到一类逻辑，他们与特定的类没有耦合关系，甚至与特定的接口（interface）也没有耦合关系。我们可以把他们抽离出来，并通过某种语法再添回到特定的属性和方法上去，实现逻辑的解耦和复用，这便是修饰器。 在基于 TypeScript 开发的库中时常能见到修饰器的身影（…

今天的夜点心我们来关注一些 ES 中的性能细节：怎样更快地创建对象。 先说结论：通过 JSON.parse 创建 JS 对象的速度要显著快于直接通过 JS 字面量来创建对象。 这个乍一听不太自然的结论对绝大多数的 JS 引擎都适用：下面列出了 4 款 JS 引擎下 JSON.p…