2023年前端发生了什么?

前言

文章内容灵感来源于What Happened in 2023?, 并结合个人观点。

这篇文章将带你回顾2023年前端圈发生了什么,时间从早到晚的顺序排列。

1. Astro v4.0 发布

2023年1月24日, Astro 2.0 发布。 而到了 12月5日,Astro 已经来到了 Astro 4.0, 是的,你没看错, Astro 今年发了 3 个大版本,这就是 Astro 团队和开源社区的战斗力!

Astro 由于其独特的岛屿架构所带来的优秀页面加载性能(Astro构建的网站客户端可以实现 0kb javascript 😱),而需要交互时候,也可以使用众多JS框架和UI库 (如 React,Vue,Anuglar等等), Astro 的性能和开发体验持续得到社区的肯定,尤其是在静态文档站点上, 社区发展也是走在正轨上。

Astro 甚至可以和同类竞品 Qwik 集合, 从而将 Astro 的岛屿架构(Island Architecture) 和 Qwik 的可恢复性(resumability) 相结合达到 Island Resumability,太潮啦!

2. Netlify 收购 Gatsby

2023年2月1日 Netlify 宣布收购 Gatsby, Netlify 是和 Vercel 类似的平台,可以提供平台即服务,常被用来托管和部署静态网站, 比如Vue 官方文档就是托管在 Netlify 上。

Gastby 则和 Next.js 类似是一个 React 元框架(框架的框架), 允许你使用 React 构建 web 应用程序,并采取各种策略来优化发送到客户端的 HTML,CSS 和 JS。

Vercel 旗下的明星产品 Next.js 以及两者之间的集成体验无疑打动许多开发者。Netlify 收购 Gastby 无疑也是为了提供更好的 paas (Platform as a Servuce 平台即服务)的支持。

3. Node.js v20 发布

2023年4月18日, Node.js v20 发布, 诞生于 2009 年的 Node.js 无疑是革命性的,如今的 Node.js 社区已经非常成熟,也已经有了固定半年发一次大版本的惯例,同年 10月17日, Node.js v21 发布。 一般来说, 双数版本是 LTS 版本,更推荐投入生产使用。

4. Qwik v1.0 发布

2023年5月2日,Qwik 正式推出 1.0 版本。

Qwik 为 web 提出了一个真正原创的想法 -- 可恢复性 (resumability) , 作者还在 X 上和 dan 展开了深入的技术讨论(撕逼), 感兴趣的查看 Angular之父为什么怼React?。

5. Signals in Angular

2023年5月3日, Angular v16 发布并引入 Signal。 Signal 并不是一个新概念, 最早于 2010年 由 Knockout 首次引入前端领域,并最终流行起来,Signals 能提供更强大的响应式能力,可以更好地控制变化检测,从而提高性能。各大主流前端框架有一个趋同的趋势,也就是采用 signals 的这种开发范式( 除了 react )。 面对这个潮流 Angular 也不得不作出违背祖宗的决定,引入 Signal。目前评分: 褒贬不一(开个玩笑)

6. Million.js v2.0 发布

2023年5月10日, Million.js 2.0发布, 同年12月7日,v3.0 发布 。

是的, 一名叫做 Aiden Bai 的高中生 开源了一个叫 Million 的库为 React 提供了优化的虚拟DOM, 这些优化使得 React 速度提高了 70%! Wow,Amazing!众所周知,高中生比 React team 更懂 React 性能优化 🤔 React 团队在干嘛呢?救一救啊! React team 专注于 Suspense 和 RSC 修补 UI 库。

7. Svelte v4.0 发布

该版本主要改动是开发体验以及减少近75%的包体积,为一个过渡版本,旨在为下个版本 v5 做铺垫。

8. Supabase Launch Week

云原生时代 (Cloud Native),由平台提供应用程序开发和部署所需基础设施的云计算服务是非常普遍的, 也就是PaaS(Platform as a Service),比如14年 AWS Lambda 的诞生标志云原生进入高级阶段, Serverless 的架构模式早已广泛应用于各大厂商产品和服务上。

Supabase 宣称是 Firebase 开源替代品, 也就是平台提供后端即服务。开发者只需要专注于应用业务逻辑,而不用编写身份验证,数据存储,文件存储等后端服务,常适合落地实现一个 idea 来实验可行性, 节省成本的同时交付速度也大大提升。

对于前端开发者来说, 如果想要快速实现一个产品。 使用 Supabase / Firebase 是一个不错的选择,当然,这种服务模式国内会相对少见,因为小公司不愿意花钱买服务,大公司则更乐意重新造一个同类的轮子。

9. Bun v1.0 发布

前端的 Spring Boot 终于要来了?

Node.js 最开始只是提供一个浏览器以外的 javascript 运行时,能干的事情很少,但经过十多年的发展,各种各样的工具库层出不穷,尽管有 Deno 类似的挑战者,依然无法撼动 Node.js 的霸主地位。

Bun.js 是一个极具野心的项目,试图打造一个前端大一统的框架, 也就是说

  • 运行时 ( Node.js )
  • 打包 ( webpack, rollup, esbuild ... )
  • 转译 ( tsc, ts-node babel ... )
  • 包管理 ( npm,yarn,pnpm ... )
  • 测试库 (jest, vitest... )

通通 All in one, 全部都能通过 Bun 搞定。

当然,目前来看,Bun 要做的事情太多了,而且人手不足,能不能做不做成还不好说, 但万一做成了,则是一个大而全的方案, 类似 Spring Boot 那样。到了那时就不止后端有自己的 Spring boy, 前端也有自己的 Bun boy。

10. HTMX 达到最高流行度

11. Meta 开源 StyleX

Meta 开源了一款CSS-in-JS库 ------ StyleX , 是一种用JS描述CSS的语法规范。 面向公众开源也就意味着它已经应用在 Instagram 和 Facebook 当中,有人宣称其是 Tailwind 杀手, 并没有很明白两者有什么共同点 🤔。

12. 前端基建还在"锈"

相信大家都能感受到,前端技术逐渐稳定下来,React 已经一年多没发版了, Vue3 甚至是2020年发布的, 更多是在折腾前端开发体验上,或者是针对一些优势场景做优化,如:

  • Nuxt dev tools 针对 Nuxt 开发体验
  • Astro 是针对静态场景
  • qwik 针对电商场景带来极致的首屏速度加载
  • React 和 Next.js 推的 RSC 针对 emm ..., 可能是针对React开发者😔
  • ....

但不可否认的是,前端基建还在"锈"。比如

  • Webpack 作者基于 Rust 重新编写的 Turbopack
  • 字节基于 Rust 编写的 Rspack
  • 为改进 Vite 生产和开发环境不一致的基于 Rust 编写仍在开发中的 Rolldown
  • 基于 Rust 的 OXlint 性能是对 ESLint 碾压级别的。

许多人正在用 Rust 重写前端工具链, 以此带来更好的开发体验。

但这是否意味着前端工程师需要学习 rust 呢? 啪,很快啊,我立马 Google,敲入rust,打开 steam 商店页面,扫码付款。开始我的 rust 之旅呢 ( 开个玩笑😆 )。

当然不是的, 前端工程师如果不是搞基建没必要学 rust,也很难学会(学习曲线不是一般的陡峭),当然如果是在校大学生有那个时间和精力支撑是可以折腾下拓展思维的~。

13. ChatGPT 的流行

相比 web3 区块链的热潮, AI 的冲击显然来得更加真实且迅猛,转眼间就对众多内容产业发起了降维打击,如绘画,编码等等, 相信许多开发者都感到了危机, 许多人甚至高呼 the end of programming, 考虑转行成为 prompt 工程师。 但目前来说, 还不能做到取代工程师, 不少工程师也是使用 ChatGPT 等 LLM 来提高日常效率。

相关推荐
Dovis(誓平步青云)10 分钟前
现场问题先关闭还是先验收,建筑任务怎样处理依赖
前端·javascript·数据库·mysql·音视频
用户842981424181013 分钟前
压缩 ≠ 加密:前端代码保护的三层实践与踩坑记录
前端·javascript
前端一课32 分钟前
别把人生过成一场等待退休的倒计时
前端
CENTER SAYS1 小时前
企业400电话办理全流程详解与材料准备(实操向)
前端·crm
:mnong1 小时前
Web 三维可视化技术对比:ParaView Web vs 本项目 wasm + Three.js
前端·webgl·opengl·opencl·科学可视化
Shirley~~1 小时前
three.js的调试面板工具
前端·3d
怕浪猫1 小时前
12个UI组件库,Star最低的下载最多
前端·javascript·面试
溪语流沙1 小时前
【Web全栈进阶】Vue3起步:组件、模板语法、响应式数据
前端·javascript·vue.js·css3
众链网络1 小时前
Agent 重试的工程解法:幂等、断点续跑与熔断怎么落地
java·前端·数据库·人工智能
User_芊芊君子1 小时前
JiuwenSwarm 协同智能体落地金融投研全流程:SwarmFlow 工作流编排与人机交互面板实测(A2UI v0.8 Web 通道适配)
前端·金融·人机交互