蒲公英 · JELLY 技术期刊 Vol.41

虚实如潮起潮落，阴阳如日出日落，万事万物都有其法则，就如同咱们学习须要有一个渐进的过程；产品会依据用户画像来布局整个我的项目的周期；开发测试的时候心愿有趁手的工具……

这些法则对于前端开发也是一样，前端框架的迭代也是会始终继续迭代的，比方说 React 17 公布之后，React 18 alpha 版本的到来也不过是顺其自然的事件，对于 React 18 新个性的介绍、设计原理解析等内容也在社区中被大家一直探讨，很多个性和思考哪怕最终不会成为 React 18 中出现，也非常值得理解和学习。

观海志

登山则情满于山，观海则意溢于海

Google 出品的 CSS 课程

梗概：本课程将系统地介绍 CSS 根底，实用于初学者和高阶开发人员，通过学习课程的各个模块，您将会理解 CSS 的外围概念，并且晓得如何在我的项目中无效地使用。

举荐语：Google 出品必属精品，CSS 作为前端最根底的技能，跟着 Una Kravets 大神重新学习 CSS，大概率会有新的播种。另外，安利 Una Kravets 大神的播客「The CSS Podcast」

React 18 更极致的批处理优化

梗概：以往 React 在某些状况下会对多个更新动作进行批处理，最终只从新渲染一次，优化更新性能。React 18 默认会进行更多的批处理操作，开发者无需再调用 unstable_batchedUpdates 手动启动批处理。Dan 在文中具体解说了批处理是什么，它以后是怎么工作的，React 18 中又带来了什么变动，以及潜在的 Breaking Changes。

举荐语：如果你不理解以后 React 批处理的具体行为，不分明为什么事件回调中多个 setState 会被合并，而事件回调中调用 setTimeout 里的 setState 又不会被合并，这篇文章将会很好地为你答疑解惑。此外，React 18 最近公布了 alpha 版本，如果你对 React 18 的新个性有趣味，能够浏览 React 18 工作组，这里会集 React 团队对 React 18 新个性的介绍、设计原理解析等内容。

深刻 React 18 的 Suspense SSR 架构

梗概：React 18 将会推出全新的 Suspense SSR 架构，这一个性汇聚了 React 团队多年的心血，能显著晋升 React SSR 的性能和用户体验。Dan 在文章中具体解说了 Suspense SSR 的设计目标、两大个性以及整体架构设计。文章图文并茂，能让读者学习到 SSR 的原理、存在的问题和 Suspense SSR 所带来的改良。

举荐语：只管引入 Suspense 的最后目标在于扭转异步加载的用户体验，但始终以来它只能用于在前端配合 React.lazy 进行应用。这将会在 React 18 中失去基本的扭转，Suspense 能把利用拆分为独立的小块，在服务端借助 pipeToNodeWritable 实现流式推送，在浏览器借助 Concurrent Mode 依据优先级进行 hydrate。这样咱们可能对 SSR 的内容进行精细化管制，解决以往服务端全量传输、客服端全量 hydrate 带来的阻塞性问题，带来相似 BigPipe 的性能，显著晋升用户体验。

React 18 新个性：startTransition

梗概：按紧急水平划分，React 的渲染能够分为两类：Urgent updates 和 Transition updates，在 React 18 中所有的更新默认为 Urgent updates。文章以一个输入框的例子，形容了 startTransition 是如何通过扭转渲染优先级到 Transition updates，从而解决 UI 阻塞问题，进而进步用户体验的。

举荐语：自 Concurrent Mode 概念推出以来，咱们理解到渲染能够是有优先级、可中断的。而 startTransition API 让咱们可能把某些渲染（渲染逻辑重的或网络提早重大）的优先级升高，防止阻塞交互性渲染（如点击、输出引起的渲染），进步用户体验。以往咱们经常应用 setTimeout、debounce 等伎俩优化阻塞性渲染，但须要留神 startTransition 和它们之间的区别（可感知 Pending 状态等）。置信 React 18 宽泛遍及后，这是一个十分重要而且罕用的优化伎俩。

轻量级 Postman 工具

梗概：Postman 代替工具，轻量级 Rest Client，目前在 VSCode 插件市场中有靠近 16w 下载量，入股不亏！

举荐语：Postman 毕竟是付费软件，日常的业务开发场景下，开发者往往只须要轻量的测试 API 的工具，Thunder Client for VSCode 兴许是更好的抉择。

十分钟弄懂用户画像

梗概：这篇文章给咱们介绍了什么是用户画像，为什么须要用户画像，用户画像对咱们有什么意义，以及用户画像标签算法，让咱们对用户画像有了比拟全面清晰的认知。

举荐语：用户画像是在构建举荐零碎中，一项是十分根底的技术，能够说是个性化举荐服务的前提。用户画像必须深刻具体的业务场景，不同业务场景用户画像是不一样的，然而构建用户画像的算法思路是大同小异。把握了这些技术办法，深刻了解业务场景，是做好用户画像的两个大前提。

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

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

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

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

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