网络日志

前端周刊第三十一期

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

大事件

  • JS1024 2022 竞赛优胜者—— JS1024 是一项“代码高尔夫”竞赛,您有 15 天的时间在 1024 字节内创建 JavaScript 或 GLSL 程序。这会产生许多创意,并带有出色的(非缩小)源代码可供查看。获胜的 JS 条目是这款古怪的打字游戏,获胜的基于着色器的条目是3D 隧道体验。这里有很多东西要学,因为这些人使用了书中的每一个技巧,包括在一个使用Brotli 和特制 WOFF2 字体文件(!)
  • Docusaurus 2.0 发布——Docusaurus 支持的站点在 JS 空间中无处不在(例如Babel 文档),经过四年的努力,流行的 React 支持的、以文档为中心的静态站点生成器的2.0 版就在这里。从头开始重建,它添加了MDX支持、新的插件系统、主题、暗模式、SPA 导航、离线支持等等。
  • Electron 20:跨平台桌面应用程序框架——20 听起来像是一个很大的、圆形的版本号,但它主要是一个典型的版本。Chromium 升级到 v104,V8 升级到 10.4,Node 升级到 16.15.0。Windows 获得了“沉浸式黑暗模式”,Electron 窗口现在可以“浮动”在全屏应用面板样式上。

文章

  1. 检查原生 JavaScript 函数是否是“猴子补丁” — 随着 JavaScript 的活力,函数可能会被覆盖(或“猴子补丁”,因为有些人称之为运行时修改的想法),但是有(不完美的)方法来查看是否这已经发生了。
  2. 关于用 Bud 更快地构建现代Web 应用程序 — Bud(不,不是Bun)是一个相对较新的 Go(lang) 和 JavaScript 驱动的全栈 Web 框架,有很多好主意 – ▶️ 这个 15 分钟的视频创建一个黑客新闻克隆这是一个有趣的演示。如果 Go 在后端适合您,那么值得一看。
  3. React 中从 500 毫秒到 1.7 毫秒 — 缓慢的自定义网格触发了分析一些瓶颈的旅程,随后进行了一些调整,从而显着提高了性能。
  4. util.parseArgs()在 Node.js 中解析命令行参数 — 今年 Node 18.3 中添加的一项功能。

框架发布

  1. Parcel 2.7
  2. Ember 4.6
  3. Ionic 6.2 - 跨平台应用程序构建工具包。
  4. Redwood 2.2 – React 支持的全栈框架。
  5. 赛普拉斯 10.4 – 任何基于浏览器的流行测试方法。
  6. Ohm 16.4 – 解析器/解释器构建工具包。
  7. React Native Boilerplate 3.5 – RN 应用程序的入门模板。
  8. Stripe Node 10.0 – Stripe API 的 Node.js 库。
  9. Electron Store 8.1 - Electron 应用程序的简单数据持久性。
  10. Meriyah 4.3 – 兼容的、自托管的 JS 解析器。( Demo )
  11. React Spreadsheet Grid 2.3 – React 的类似 Excel 的网格组件。
  12. Inferno 8.0.2 – 快速、类似 React 的库。
  13. Peaks.js 2.0.3 – BBC 的音频波形 UI 组件。

代码和工具

  1. vue-grid-layout:适用于 Vue.js 的可拖动和可调整大小的网格布局:类似于Gridster.js(来自 jQuery 时代!),但适用于 Vue.js。主页上有一个演示。
  2. safe-json-value:当 JSON 序列化不能失败时:防止JSON.serialize()抛出异常、更改类型或以其他方式意外转换值,因为有时您需要那种保证。
  3. colorgrad:高性能、Rust 驱动的颜色渐变库:在幕后使用 Rust 编译到 WebAssembly——非常现代!如果您也想尝试它,它也是一个很好的小型代码库,可以用来学习该技术。
  4. Embla Carousel 7: Carousel with Fluid Motion 和“Swipe Precision”:一个备受诟病的 UI 元素,但这些示例对我们来说效果很好。与库无关,但如果需要,可以轻松集成 React、Vue 和 Svelte。
  5. Nativefier:使任何网页成为桌面应用程序:一个基本的 Node.js 驱动工具,用于为任何使用 Electron 作为 web 视图的网站创建桌面“应用程序”。适用于 Windows、macOS 和 Linux。
  6. ts-version:从 Types 访问当前的 TypeScript 版本:创建者说得最好: “对 TS 版本如何处理您的包略有不同感到沮丧,但又不想使用 TypesVersions 发布您的类型的完整副本?现在您可以根据 TS 版本调整您的类型!”