前端周刊第十九期

前端周刊发表每周前端技术相关的大事件、文章教程、一些框架的版本更新、以及代码和工具。每周定期发表，欢迎大家关注、转载。
<span style="color:red;">如果外链不能访问，关注公众号前端每周看，里面有解决办法</span>

大事件

• 使用 Google 的 CrUX 比较 JS 框架的性能——Chrome用户体验报告 ( CrUX ) 是从真实世界的 Chrome 用户收集的用户体验指标数据集，可以使用它来分析和比较不同 UI 框架的性能配置文件

• Meta 将 Jest 项目转移到 OpenJS 基金会——Meta，née Facebook，在 10 多年前创建了现在流行的 Jest JavaScript 测试框架，虽然它将在内部继续使用，但他们现在认为它“功能完整”，因此认为它可能会蓬勃发展在更广泛的社区中得到更好的管理。

• 关于 React 即将推出的useEventHook的思考——用于新的基本 React 钩子或定义一个“看到”新的 props/state 但具有稳定函数标识的事件处理程序。

文章

1. 使用 Web 音频 API 构建乐器 — 我们在前端领域最喜欢的作家之一回来了，她简单地介绍了她如何构建Keyboard Accordion，这是一种基于 Web 的全音阶手风琴（我很难以任何连贯的方式演奏它一切，但听起来很棒）。

2. 了解您的浏览器的性能分析器 — 如果您的浏览器开发工具中的性能选项卡看起来有点吓人，那么本文试图总结您需要了解的关于它所显示内容的绝对基础知识。

3. JavaScript 开发人员从 0% 到 80% 的 Rust - 如果关于用 Rust （重新）编写 JavaScript 工具的永无止境的消息还没有让你感到厌倦，也许你想知道如何从 JS 的角度学习 Rust。Daniel Bulant 的Rust 基础，从高级程序员的角度来看，也是一个很好的解释者。

4. 使用 PyScript 在浏览器中运行 Python - 从 Rust 到 Python，我们开始了。最近发布的PyScript提供了一种在网页上编写 Python 代码的简单方法，就像您现在编写 JavaScript 一样。这个 8 分钟的截屏视频稍微展示了一点。

5. 用 JavaScript 制作一个基本的“落沙”游戏 - 一个平静而平和的教程，其中包含贯穿始终的示例。

框架发布

1. Wild Wild Path 3.0 – 使用路径和查询挖掘对象。
2. GraphQL Yoga 2.0 – 完整的 GraphQL 服务器功能。
3. Hexo 6.2.0 – Node.js 博客框架。
4. graphql-schema-linter 3.0 - 验证 GraphQL 模式定义。
5. pnpm 7.1.0
6. Solid 1.4 – 很棒的声明式 UI 库。

代码和工具

1. InfiniteGrid 4.3：在网格布局上无限排列卡片元素：非常成熟和成熟，可以轻松创建由不同大小的卡片元素组成的网格。它也适用于您选择的框架，并且在桌面和移动设备上都很满意。

2. blursort 1.9: Fast Fuzzy Search Library：灵感来自 Sublime Text 中的模糊搜索。查看现场示例- 确实感觉很快。

3. Parvus：无依赖的可访问灯箱：我喜欢它所说的不要在网页上使用叠加层，但如果必须，使用它！有一个 CodePen 示例。

4. crypto-random-string 5.0：生成加密强随机字符串：例如：cryptoRandomString({length: 10})可能会返回2cf05d94db（虽然我真的希望你尝试它时不会返回，否则它会失败😆）。现在可以在 Node.js 和浏览器中使用。

5. Reagraph: WebGL Graph Visualizations for React：一个在底层使用 WebGL 的高性能网络图形可视化库。您可以使用的基本示例。

6. DFlex：适用于所有 JS 框架的拖放库：这是一个原生 JavaScript 解决方案，专注于良好的性能和易于实现。在这里尝试一些演示。

7. nve 15.0：使用特定的 Node.js 版本运行事物：使用特定版本（或多个版本）的 Node.js 轻松执行文件、命令或 REPL。例如，您可以一次运行npm test多个版本。

8. actions/github-script：用 JavaScript 编写 GitHub API 脚本的工作流程：如果你想编写通过 GitHub API 执行操作的 GitHub 操作，这可以让你的生活更轻松。