前端周刊发表每周前端技术相关的大事件、文章教程、一些框架的版本更新、以及代码和工具。每周定期发表,欢迎大家关注、转载。
如果外链不能访问,关注公众号前端每周看,里面有解决办法
大事件
- Web Almanac 2022 对现实世界中 JavaScript 状态的看法—— 更好的是:调查还是来自 800 万个站点的真实世界使用数据?如果您更喜欢后者,那么这是给您的。Web Almanac是关于在线使用哪些技术的年度“网络状态”报告,在 20 多章的见解中,有一个特定于 JavaScript 的章节。一些亮点:
- 比以往任何时候都更多的 JavaScript 正在通过网络传输。1.3MB 的页面只会让你处于第 90 个百分位(!)大约一半也没有使用。
- 77% 的移动页面在\<head>
- import几乎看不到动态——大约占页面的 0.3-0.4%。
- Web Workers用于 12% 的页面。
- 在 1,000 个顶级网站中,17% 使用 webpack,约 1.5% 使用 Parcel。
- Psst .. jQuery 仍然在各地使用..
- 宣布 TypeScript 4.9 Beta—— 这是一个非常令人满意的更新,它引入了satisfies运算符,当您想要验证表达式的类型与某种类型匹配但不更改实际结果类型时。当in缩小具有未列出属性的类型时,运算符也变得更强大。
- JavaScript Web 框架的“新浪潮”—— 几个月前,他介绍了 React 状态管理的新浪潮,现在 Rem 又回来尝试“理解新的 Javascript Web 框架的扩散”。我们都一样。Vue、Svelte、Solid、Remix、Astro 和 Qwik 都在这里亮相。虽然没有 Lit 或 Web 组件。
文章
- 在 .NET 7 中使用任何 JavaScript 应用程序中的 .NET — 通过著名的TodoMVC 移植到通过 WebAssembly 运行的 .NET 来展示 JavaScript 到 .NET 的互操作Blazor是浏览器中最常与 .NET 和 C# 关联的框架,但该支持也独立于 Blazor 工作。
- 使用 JavaScript 编写可组合 SQL — 使用 SQL 数据库的方法有很多,作者更喜欢纯 SQL 和Slonik。如果您更喜欢更抽象的东西,当然, Knex.js仍然是一个选择。
- 在 React 中构建一个可访问的选择组件 — 一步一步(或者我们应该说一砖一瓦?)教程,介绍如何构建一个专门考虑可访问性的选择组件,这是一个像 LEGO 这样的国际企业所关注的主题心。
- 使用 JavaScript 进行电话振动的快速指南 — 了解如何做到这一点,然后不要这样做
框架发布
- Electron 21
- Node.js 18.10.0(当前)
- Astro 1.4
- Neutralino.js 4.8
↳ 轻量级跨平台桌面应用程序框架。
- Boa 0.16
↳ 用 Rust 编写的 JS 词法分析器、解析器和编译器。
- react-number-format 5.0
↳ 用于在输入中格式化数字或作为文本的组件。
- jest-native 5.0
↳ 用于测试 React Native 应用程序状态的 Jest 匹配器。
- Pogo 0.6
↳ Deno 的服务器框架。
- Eruption
↳ React/TypeScript 的“下一代”样板,建立在Vite之上。
代码和工具
- Billboard.js 3.6:基于 D3.js 的 JavaScript 图表库:非常强大且流行的聊天库现在具有官方 React 包装器、新的“线性渐变”条形图选项和。
- Liqe: Lightweight Lucene-like Parser and Search Engine:让您使用 Lucene 风格的搜索查询语法来查询或测试 JavaScript 对象中已有的内容,例如filter(parse('height:>170'), people);
- create-t3-app:交互式 CLI,用于快速建立一个自以为是的、全栈的、类型安全的 Next.js 项目:甚至还有来自Theo 的10 分钟截屏视频- ping․gg展示了如何使用它。
- Glide.js 3.6:无依赖的滑块和轮播控件:“专为滑动而设计。不多,不多”,创作者说。麻省理工学院许可和成熟。
- Preview.js:IDE 中的快速组件预览:此扩展将自动在预览中的组件中生成有效的道具,支持 CSS-in-JS,并且可以离线工作。适用于 VS Code 和 IntelliJ/WebStorm,也支持 Solid 和 Vue 组件。
- 🅰️ 'Photoshop 将图层快速导出到文件' :你知道你可以使用 JavaScript编写 Adobe Photoshop 脚本吗?它非常强大,但是当我使用它时,我发现很难找到可以学习的好例子——所以这个项目非常受欢迎。
- Ezno:一个实验性的 JavaScript 编译器:一长串 JavaScript 编译实验中的最新一个——我们都在这里。这篇文章解释了哲学和推理以及为什么类型检查是它的核心: “您可以将其视为 TSC 的扩展,类似的想法但更进一步。”
- textlint: 用于文本和 Markdown 的可插拔 Linting 工具:想象一下 ESLint,但用于自然语言和标点符号。开箱即用地支持 Markdown 和文本,但可以添加其他格式(例如 HTML)。