前端技术双周刊#10-2021.11.10

JavaScript

• Writing clean JavaScript tests with the BASIC principles
  作者认为很多团队没有做好单元测试覆盖的一个重要原因，不是大家不想做，而是测试用例写的太差劲，导致无法持续，以至于形同虚设。所以作者给出了写单测的5个原则（BASIC），通过例子说明了遵循它的好处
• 用 TypeScript 类型运算实现一个中国象棋程序
  用TypeScript类运算符实现，思路上非常有趣

CSS

• A Guide To CSS Debugging
  本文将常见的 CSS 问题分为4类，分别讲了对应的 debug 方法。1. Overflow of content from its parent. 2. Inheriting browser inconsistencies. 3. Unexpected inheritance from the cascade. 4. CSS resiliency failures from DOM changes
• 聊聊纯 CSS 图标
  作者提出了一种使用图片实现 CSS 图标的方案，同时又能够支持可缩放、可着色、彩色图标等要求

Node.js

• Web Streams Everywhere
  stream 是对 I/O 抽象的标准 API，在前端业务场景中应用越来越广泛。这里对 node/web stream 的用法做了详细的讲解
• Is Deno Still a Thing? A Look at the Status of the Node Killer
  Deno 正式发布一年多了，比起当初要替代 Node.js 的雄心，现在好像没有什么水花。但实际上它也在稳健的发展，看看它最近的进展吧
• Node.js 后端框架 star 数排名
  2021年11月更新的，可以作为 Node.js 后端框架选型参考

前端框架

• 不要再拿组合式 API 与 React Hooks 来对比了！
  Vue 的组合式 API 在设计之初受到过 React Hooks 的启发，且这两者都可以把逻辑抽象成函数的组合，来实现逻辑的内聚与复用，在视觉上有相似之处。但是本质上组合式 API 与 React Hooks 的心智模型还是大不相同的

开源产品

• 北海 (Kraken) v0.9 — 支持 QuickJS 首屏性能再提升 20%
  Kraken 0.9版本加入了几大新特性：1. 支持 QuickJS 作为 JavaScript Engine；2. 支持 HTML 文件的解析和渲染；3. 支持 HTTP 协议的缓存特性；4. 支持 Vue/React 官方工具链；5. 支持模块热更新；6. 支持 querySelector / querySelectorAll
• XState
  一个比较标准的有限状态机的实现，并可以通过图形化的方式转换为状态图的形式。同时也是一个状态管理库，但状态驱动的思维和 Redux 等库有很大不同

工具

• npkill
  电脑空间不够用了，这个工具可以帮你安全快速的清理电脑上的 node_modules

扩展阅读

• Hermes 即将成为 React Native 默认的 JS 引擎
  重点介绍了过去两年来在推动 Hermes 成为 React Native 最佳 JavaScript 引擎方面取得的各项激进展。RN 官方团队有信心通过更多改进让 Hermes 成为各类平台上 React Native 中的默认 JS 引擎
• iOS 端容器之 WKWebView 那些事
  文章描述了 WKWebView 使用中常见的4个问题：请求代理问题、Cookie 管理问题、全面屏适配问题和 WebContent 进程崩溃问题，同时也给出了对应的解决办法
• 元宇宙下的前端现状
  最近元宇宙一词爆火，作为大家口中的“互联网的最终形态”，需要如今大热的包括 AR、VR、5G、云计算、区块链等软硬件技术的成熟。才能构建出一个去中心化的、不受单一控制的、永续的、不会终止的世界。上面提到的各项技术，和目前前端关联比较大的，便是 AR、VR，探索元宇宙下的前端～