前端食堂技术周刊第 81 期：4 月登陆 Web 平台的新内容、Angular v16、Next.js 13.4、Qwik v1.0、Vue 3.3 新特性前瞻

本文链接：https://blog.csdn.net/weixin_37352936/article/details/130570157

本期前端食堂技术周刊介绍了Angularv16的反应性模型，Next.js13.4的AppRouter稳定版，Qwikv1.0的高性能特性，Svelte的新功能如CSS@containerqueries，以及ECMAScript2023即将发布的新功能。此外，还提及了Rspack的更新和React渲染的交互式指南。

摘要由CSDN通过智能技术生成

美味值：🌟🌟🌟🌟🌟

口味：黑加仑乌龙茶

食堂技术周刊仓库地址：https://github.com/Geekhyt/weekly

本期摘要

4 月登陆 Web 平台的新内容
Angular v16
Next.js 13.4
Qwik v1.0
5 月 Svelte 的新功能
Rspack v0.1.9
TailwindCSS vs UnoCSS
ECMAScript 2023 的新功能
Vue 3.3 新特性前瞻和简单评价
React 渲染交互式指南

大家好，我是童欧巴。欢迎来到前端食堂技术周刊，我们先来看下上周的技术资讯。

技术资讯

1. 4 月登陆 Web 平台的新内容

在 4 月份，Firefox 112，Chrome 112 发布稳定版本。

Firefox 112

引入 inert 全局属性
linear() easing function

Chrome 112

支持 CSS 嵌套，引入了一个新的嵌套选择器 >
支持 animation-composition
全新无头模式

2. Angular v16

Angular v16 发布，主要特性如下：

开发者预览版引入全新的 Angular 反应性模型，提供 Angular Signals 库，与 RxJS 保持互操作
服务器端渲染和水合作用增强，Angular 服务端渲染的下一步计划
开发者预览版引入基于 esbuild 的构建系统
使用 Jest 和 Web Test Runner 进行更好的单元测试
一系列改善开发者体验的功能

3. Next.js 13.4

Next.js 13.4 发布，主要特性如下：

App Router 稳定
Turbopack(Beta)
Server Actions(Alpha)

4. Qwik v1.0

Qwik 发布 v1.0，主要特性如下：

开箱即用获得惊人的用户体验

JavaScript 流式传输的即时加载，使应用程序在 CWV 得分上保持出色的表现，即使应用程序越来越复杂
推测性代码获取，在用户需要时提供所需代码，以确保即使在慢速移动设备、不可靠的网络上也能实现即时用户交互
懒执行，给浏览器主线程最大的自由
优化渲染时间，Qwik 是响应式的，默认情况下，它只会更新肯定需要的内容，而不是更多内容
从服务器开始获取数据，以防止“瀑布”延迟

出色的开发体验

熟悉的 JSX，就内味儿
文件式路由，行业首选的声明路由的方式
一流的数据访问，Qwik 的 data loader 和 form actions 轻松访问服务器数据，并具有 100% 的端到端类型安全和用户输入验证功能
以一种可移植的方式声明中间件逻辑，能够部署到所有主要的主机供应商
统一的执行模式，通过 server$() 可以创建一个始终在服务器上执行的函数

5. 5 月 Svelte 的新功能

Svelte

支持 CSS @container queries
bind:innerText 可用于 contenteditable 元素
一个新的可访问性警告 a11y-interactive-supports-focus，当交互式元素不可用时会发出警告

SvelteKit

当启用 HMR 时，页面将在修复错误后重新加载
embedded 模式下支持同时加载两个应用程序到同一个 HTML 页面中
Vite 的 compilation 现在会记录警告信息

6. Rspack v0.1.9

Rspack 发布 v0.1.9，主要提升了 Loader 兼容性，进行了性能改进，添加了一系列新功能。

下面我们来看技术资料。

技术资料

1. TailwindCSS vs UnoCSS

作者对 TailwindCSS 和 UnoCSS 进行了多方面的对比，从功能上来看：

Tailwind 几乎提供了你能想到的所有 CSS 功能的对应类名，还有一些你可能不知道的有用的功能，比如 isolation，支持自定义 CSS 以及使用插件扩展框架。
UnoCSS 支持 Tailwind 的所有功能，还额外支持如 variant groups 、更多的动画效果、attributify mode 等。