蒲公英 · JELLY 技术周刊 Vol.17

React Hooks 置信大家都不生疏，自被设计出以来就备受好评，在很多场景中都有极高的使用率，其中原理更是很多大厂面试中的必考题，很多敌人都可能一五一十。那么如何去用实现一个简略的 React Hooks 呢？或者大家都有各自的想法，但也无妨来看看文中所述的计划是如何构建的。

登高远眺

天高地迥，觉宇宙之无穷

根底技术

2020 Chrome DevTools 的新个性介绍

作为前端开发，与 Chrome 打交道是粗茶淡饭，咱们有必要理解 Chrome 调试工具的更新迭代，对日常开发和调试带来哪些帮忙和改善。新 Chrome DevTools 集成了 lighthouse，并且在元素审查面板和性能面板都有肯定水平的优化，本文还提供了相干个性的视频演示，十分易于了解学习。

浏览器的工作、微工作、队列和调度

浏览器里的事件循环（Event Loop）始终都是一个陈词滥调的话题，社区里各种文章和材料也不少，然而你真的分明事件循环外面的 tasks、microtasks、queues 这些概念以及他们的调度关系吗？本文是 Google Chrome 的开发人员 Jake Archibald 撰写的一篇博客，内容深入浅出，在任务调度及 JS 栈的局部还仔细的绘制了 CSS 交互动画，最初还探讨了不同浏览器的差别以及相干标准的定义，十分值得一读。

Node.js 内存透露指南

因为 Javascript 采取了基于垃圾回收机制的内存治理形式，所以开发人员个别不会关注内存的调配和开释，但在开发过程中稍不留神就可能造成重大的内存透露。本文解释了 Javascript 的垃圾回收机制，列举理论例子介绍 Node 服务中的内存透露场景，并且重点讲述了如何利用 heapdump 和 chrome devtools 来精准定位线上服务的内存透露地位，对于 Node 服务的性能优化有参考意义。

前端框架

仿照 React 源码流程打造 90 行代码的 Hooks

作者通过模仿 React 的数据结构与工作流程，来应用精简的代码实现出 useState Hook。学懂本文的分析和对应的源码后再去看 React Hooks 的源码局部，能更加容易的了解。如果你只是简略应用过 Hooks 或还没理解过 Hooks，浏览本文是一个很好的学习机会。

图形编程

应用 web worker 驱动 webGL 渲染

介绍透过 OffscreenCanvas API，实现 web worker 驱动 webGL 渲染。把更新渲染的逻辑分到主线程之外能无效缩小 js 执行导致的页面响应阻塞。文中提供了一个 demo 的比照数据。

工具推介

PolyK – 用 Javascript 编写的多边形库

PloyK.js 提供了多个函数来帮忙你更轻松的解决多边形，搭配一些物理引擎也能够做出一些乏味的成果，例如上面这个应用 phaser+matter.js 的 demo，基于 ployk.js 库能够用很少的代码实现物体的切片，这可能能够给你开发 H5 游戏带来一些新的想法。

桑田拾遗

桑田拾遗，积跬步以至千里

Nerv – 类 React 组件框架

当咱们在前端畛域一直向上攀登的过程中，随着对 React 这一类框架的不断深入了解，大脑中总是会冒出一个这样的想法：“我也能实现一个像是 React 这样的框架”，Nerv 就是在京东这样想法就的落地实现，置信通过 Nerv，你会对 React 有不一样的理解。

在小程序中应用 React Hooks

如果抉择 React 来开发小程序，置信你对于 Taro 多少有肯定的理解，或者你当初正在通过 Taro 3.x 在小程序平台中按本人的志愿构建想要的小程序。然而回顾 Taro 倒退的过程中，反对 Hooks 也曾是须要针对性优化的个性之一，通过这些个性实现的思考，对本身技术的晋升大有裨益。

「蒲公英」期刊，每周更新，咱们专一于开掘「根底技术 、 工程化 、 跨端框架技术 、 图形编程 、 服务端开发 、 桌面开发 、 人工智能 、 设计哲学 、 前端框架」等多个大方向的业界热点，并加以业余的解读；不仅如此，咱们还会推介精选凹凸技术文章，向大家出现团队内的钻研技术方向。

低头俯视，蒲公英的种子会生根发芽，如夏花灿烂；格物致知，咱们登高远眺、桑田拾遗，以求积硅步而至千里。

蒲公英 · JELLY 技术周刊奉献指南

欢送关注凹凸实验室博客：aotu.io

或者关注凹凸实验室公众号（AOTULabs），不定时推送文章。