蒲公英 · JELLY技术期刊 Vol.44
观海志
使用 esbuild 加速 webpack
梗概：esbuild 是使用 go 编写的打包工具，和 Webpack、Rollup 等常用打包工具对比，在速度方面拥有绝对优势。esbuild-loader 可以用于在 Webpack 中使用 esbuild 去编译 JS、TS；压缩脚本、样式等，让我们有机会同时拥有 Webpack 的生态和 esbuild 的编译速度。具体有多快？看看社区怎么说。
推荐语：esbuild 推出已有一定时间，大家惊叹于它的速度的同时，可能受到历史原因的影响，没有办法在工作中真正运用起来。利用 esbuild-loader，我们在 Webpack 项目中也可以体验 esbuild 带来的编译速度优化。尤其在 dev 环境，我们对编译结果和体积要求不高的情况下，使用 esbuil-loader 能大大提升编译效率。
网易云的熟人社交玩法
梗概：前段时间，网易云音乐上线了一个基于熟人社交投票玩法的 h5 活动，该活动依据投票数权重值来划分格子块，并通过格子块之间无缝挤压动效极大地增加了趣味性。本文将着重介绍如何基于 treemap（矩形树图）来实现一个稳定的动态格子块挤压效果以及在这其中遇到的一些问题。
推荐语：该案例是算法在前端业务中落地的典型场景，从需求分析，到算法选型，再到性能优化，最后进一步追求「完美」的用户体验，都验证了作者小结的一句话「它值得琢磨，有点东西，少年感永不过期」。
状态管理利器 XState
梗概：XState 基于有限状态机，是一个专业的状态管理的库。\
对比传统状态管理，XState 解决了可能存在的一些问题，例如：混淆了状态和数据、状态转移不够严谨、缺乏概念化难以表述等。\
XState 对开发友好。它的状态图的可视化工具，能让人对状态机的整体一目了然。此外，它也提供了优秀的生态支持，集成了 React、Vue、Svelte、不可变数据 Immer 等。
推荐语：在开发设计时，经常需要考虑如何维护逻辑状态和业务流程等，复杂的状态会导致维护成本剧增。\
状态机有着清晰的状态和状态转移定义，辅以层级、并发、数据等拓展元素，可以非常有效地管理状态。\
XState 围绕状态机相关的 SCXML 规范和 Statecharts 理念实现，其中的概念和设计也十分值得学习。
TypeScript 是如何工作的
梗概：TypeScript 是一门基于 JavaScript 拓展的语言，它是 JavaScript 的超集，并且给 JavaScript 添加了静态类型检查系统。本文就来探讨简单探讨一下 TypeScript 是如何工作的，以及有哪些工具帮助它实现了这个目标。
推荐语：目前大多数项目都已经使用 TS 进行开发，稍微深入了解 TypeScript 的工作原理，及相关插件工具，更有利于 TS 在项目开发中发挥最大作用
流觞亭
深入浅出 V8 引擎
梗概：V8 引擎就是一个使用 C++ 编写的高性能 JavaScript 和 WebAssembly 引擎，主要作用于 Chrome 浏览器 和 NodeJS ，能够完成 编译/执行 JS 代码，管理内存，负责垃圾回收，与宿主语言的交流等工作。
推荐语：每一个前端同学应该都对 V8 引擎不陌生，我们每天的工作都和 V8 引擎相关，如果我们可以更加熟悉内部的原理，那会给我们的日常工作带来极大的助力。