CSDN 编者按】这是一篇由 Ryan Carniato 于2023年12月29日发表的关于「2024年JavaScript 框架发展趋势」的文章。作者认为 2023 年是 JavaScript 框架发展的重要一年,预计 2024 年将继续看到更大的变化,其中包括服务器优先、混合路由、边缘网络和人工智能等方面的发展。此外,2024年可能会继续加强框架的成熟化趋势。作者对于简化方案,如 Astro 和 HTMX,仍然持乐观态度,并期待框架能够更好地履行其承诺,专注于提供更有力的解决方案,减少复杂性。
作者 | Ryan Carniato 责编 | 梦依丹
岁末年初,恰逢年度总结时刻。不少开发者也在积极参加 CSDN 举行的年度征文活动——2023年,我的编程之旅。晒出自己过去一年的技术成就与所在领域的技术变化,GET 到的新功能、新技术等。
近日,知名前端爱好者,SolidJS UI 库作者,同时也是 MarkoJS 核心团队的成员 Ryan Carniato 撰写了《进入2024 的 JavaScript 框架》,本文总结了 JavaScript 框架在 2023 年的技术趋势与 2024 年的预期变化。
以下为译文:
对于 JavaScript 框架来说,2023 年是相当重要的一年。新技术终于展示出了它们的实用性,而旧框架也在卷土重来。如果你没注意到的话,可能就错过了一个相当重大的转变。我预计,2024 年将继续带来更大的变化。这一次的重点不再是新技术,而是对现有技术的改进和完善。基础已经打下,我们有更多的内容可以实现和呈现给用户。如果要为过去几年选择一个主题,那就是"服务器优先"。这个观点一直备受争议,但无可否认。短短几年前,人们都在谈论渐进式 Web 应用和离线优先的概念。但是,这种讨论几乎销声匿迹。https://twitter.com/htmx_org/status/1725241732260847914相反,HTMX 以其犀利的观点,解释了为什么 JavaScript 是一个错误。Astro 也毫不掩饰地接管了内容站点开发。甚至 React 核心团队也接受了服务器的简洁性,正如 Dan Abramov 在演讲中所强有力表达的那样,他探讨了如果 React 一直以服务器为优先会怎样。那么,我们曾经钟爱的单页面应用(Single Page App)在这么短的时间里经历了什么?它现在是否还存在,我们现在是生活在多页面应用(Multi-Page App)和只有服务器渲染的 HTML 时代吗?去年,我也写了一篇类似的文章,探讨 JavaScript 框架的发展趋势。那篇文章所提到的三大技术趋势成了过去一年讨论的重点。
自从 SolidJS 和 Vue 开始采用反应性原语之后,Preact 和 Qwik 紧随其后,这种趋势在 2023 年变得更加强劲。https://github.com/angular/angular/discussions/49090
在二月,Angular 团队也宣布采用了这一技术。该消息在社交媒体上引起了很大的轰动。不仅如此,这也是导致 Angular 引起重大关注的几个因素之一。有人甚至称之为 Angular 的复兴。而且,这是过去几年来 React 团队首次加入了这场争论,因为人们开始纷纷问道:“React 何时会采用 Signal 呢?”关于这个问题,我在下面的文章中写了更详细的回答(还附有与 Dan Abramov 在中评论的讨论)。不过,简单来说,React 团队对 Signal 这种 API 并不太感兴趣,他们更期待的是「Forget」编译器,因为它能起到类似的作用。当然,Signal 的应用并没有到此结束。谷歌的 Web 组件框架 Lit 发布了原生支持信号的 Lit 3。Rich Harris 则透露了 Svelte 的未来发展方向,他们基于 Signal 的新「Runes」将成为即将发布的 Svelte 5 中主要的响应式来源。到 2023 年底,Signal 已经成为大多数前端 JavaScript 框架的重要组成部分。服务器端路由在过去一年中变得越来越重要。从 2022 年底开始,这种模式逐渐被人们所接受,比如使用 React Server Components 和 Astro 的 View Transition API 集成。 它的基本原则是,在初始页面加载后,服务器端的渲染不应影响客户端的导航,而客户端的导航也不应意味着我们需要发送所有的 JavaScript 来渲染那些可以在服务器端静态渲染的页面部分。需要注意的是,不同的解决方案产生的效果也不同,这一领域仍在发展之中。我们正在进入一个全新的领域,它既不是传统的单页应用程序,也不是传统的多页站点。我们需要了解新的权衡和概念。而且,我们还远没有解决所有的问题。
边缘函数似乎是显而易见的成功案例之一。将服务器靠近最终用户来大大减少延迟。使用更轻量级的运行时,可以大大减少冷启动时间。如果说 2023 年有什么不同的话,那就是边缘技术发展的一年。我们一开始非常热情。毕竟,Cloudflare 发布了边缘数据库,我们所有喜欢的提供商都开始提供边缘函数,我们最喜欢的框架也添加了开箱即用的支持。供应商已经成立了一个名为 WinterCG 的委员会,来讨论平台的标准化问题。未来就在眼前。
我们最终意识到,即使在这些边缘函数中,某些 Node API 也是必不可少的。你可以感谢或讨厌 Next 和 Vercel 将 AsyncLocalStorage 推广到每个运行时,但我们需要它。 我们还意识到,边缘数据库对于所有应用程序来说永远是不够的。即使有流媒体,服务器水瀑仍然真实存在且影响很大。是的,即使使用 React Server Components 也是如此。但这确实推进了我去年提出的目标,即使用分布式部署进行整体创作。我们看到服务器函数(server$,使用 server)甚至像工作器函数这样的变体在年初就出现了,表明我们可以分布我们部署 API 的方式,被 Solid、Qwik 和 Next 采用。 到年底,Next 14 发布了新的实验性部分预渲染,允许单个请求从边缘提供静态内容,同时通过代理到更靠近数据库的无服务器函数,所有内容都被流式传输,以提供类似于边缘的体验,而无需在那里部署整个应用程序。看到一些独创性提供了两全其美的解决方案,真是令人敬畏。https://twitter.com/rickhanlonii/status/1722704383064842280
我已经讲了很多关于 Signals 的内容,但真正的好处还没有显现出来。JavaScript 中已经有了类似 Signals 的细粒度原始函数 15 年了,那为什么是现在呢?https://twitter.com/t3dotgg/status/1730711700805140908
预计 JavaScript 框架将进一步整合 Signal 机制,例如 Vue Vapor 和 Svelte 5 中的新反应性模型。既然服务器端渲染框架已经得到了很大的支持,那么下一个合理的发展方向就是继续探索如何最大限度地发挥这种新功能的作用。标准的制定比较慢,WinterCG 也需要一些时间,但这并不会阻止发展的势头。 为了实现差异化,我预计框架和基础设施提供商将面临提供独特功能的压力,而这些功能可能仅在特定平台上可用。虽然 2023 年看到了各提供商在提供类似功能方面的平等化趋势,例如在基本静态和函数托管之外提供键值存储 Blob 等功能,但我认为在提供独特价值方面的竞争将会加剧。 框架的作用是保持一致的创作体验和思维模型,同时寻找利用新功能的方法。这与 21 世纪初的浏览器大战类似,未来还有很多发展空间。去年,从框架的角度来看,谈论人工智能还为时尚早。明年可能也是如此。但它已经渐渐出现在我们的视野中。代码迁移和生成工具都是很好的想法,但它们与多年来使用的可视化无代码或低代码编辑器面临着同样的问题。人与机器的交互界面仍然至关重要。毕竟,代码是一个活生生的存在。它随着时间的推移不断生长和维护。在过去的一年里,与其他框架的作者交流时,我们发现人工智能引起了周围人的极大兴趣。https://twitter.com/aidenybai/status/1737616282210738650
人工智能正在回答一个长久以来的问题,那就是为什么你的应用程序运行缓慢。
对开发工具的影响只是其中一方面。我们还越来越多地看到实时性能被融入到框架中。这不仅指的是用于持久化后端的 Websockets。元框架中的 API 已经发展到超越简单的 JSON,实现了完全流式的跨网络 JavaScript 执行,这在 SolidStart、Qwik 和 Next 中通过“服务器函数”实现。现在,我们可以很容易地想象出生成技术实时创建你的用户界面的情景。https://twitter.com/mhevery/status/1722928972789408240
2024 年可能会延续我们在过去几年看到的成熟趋势。从 2020 年到 22 年,我们看到了很多新的 JavaScript(和 WASM)框架(Qwik、Million.js、Astro、Next 13、Remix、Hydrogen、SvelteKit、SolidStart、Leptos、Dioxus、HTMX),但去年的情况发生了改变。不再出现大量新的 JavaScript 框架,相比之下相对较少。然而,我们已经找到了解决问题的方法和途径。现在的关键是要充分发挥这些方法和途径的潜力,将它们应用到实际开发中,取得更好的效果。我不确定我们是否已经成功地解决了复杂性问题,这给像 Astro 或 HTMX 这样简化的解决方案带来了很大的肯定。但我仍然充满希望。 也许不太可能期望每个人都对“单页应用程序”的确切定义以及何时使用各种选项达成一致,但这些解决方案每天都变得更加强大,能够实现它们既定的目标。现在不再怀疑我们熟悉的Web开发将发生变化。即使方向还不完全明确,革命已经来临。期待与你一同见证这一变革。969后,托德尼尔逊提出超文本的概念,IBM公司的Charkes Goklfard等设计出了通用记语言-GML。到1978年,美国国家标准局一工作组对GML 进行了规范,推出了命名为SGML的通用标记语言。1980年,ISO正式确定SGML为描述各种电子文件结构及内容的国际通用标准。
1990年,Tim Berners-Lee将他设计的初级浏览和编辑系统在网上合二为一,创建了一种快速小型的超文本语言来为他的想法服务。他设计了数十种乃至数百种未来使用的超文本格式,并想象智能客户代理通过服务器在网上进行轻松谈判并翻译文件。它同Macintosh的Claris XTND系统极为相似,不同的是它可以在任何平台和浏览器上运行。
最初的HTML语言以文字格式为基础,可以用任何编辑器和文字处理器来为网络创建或转换文本,仅有不多的几个标签。网络从此迅猛发展,人们开始在网上发布信息。很快人们就开始琢磨在网上放置图像和图标。
1993 年,NCSA推出了Mosaic,也就是第一个图文浏览器,从此 Web开始迅速地发展起来。HTML语言也不断产生新型、功能强大且生动有趣的标签形式,例如<background>、<frame>、<font>和<blink>等。
但是此时,出现了许多不同的HTML版本,而只有设计者和用户共有的HTML部分才可以正确的显示。因此在这段时间,W3C都在激烈争论名叫HTML3的新技术,该文件概括了所有全新的特性,没有任何技术支持。出于这种混乱局面的考虑,在 1996年,W3C的HTML Working Group组织编写了新的规范,从此 HTML 3.2开始发展,它更接近于现实的目标,即提供给内容商和浏览器发展商在研究工作中一个公允的参考标准。
1997年12月18日,W3C推荐标准:HTML 4.0,1999年12月24日,W3C推荐标准:HTML 4.01(微小改进)。
到现在为止,HTML已经发展到了HTML5版本,HTML5 技术结合了 HTML4.01 的相关标准并革新,符合现代网络发展要求,在 2008 年正式发布。HTML5将Web带入一个成熟的应用平台,在互联网平台上,视频、音频、图像、动画以及与设备的交互都进行了规范。
下篇:前端入门——html 文字格式、标题与段落
者 | Agazi Mekonnen
译者 | 明知山
策划 | Tina
最近,Rising Stars 发布了 JavaScript 生态系统趋势发展报告,根据 GitHub Stars 展示了 2023 年的一些杰出项目。总的来说,最受欢迎的项目是 shadcn/ui。这是一个可用于创建自定义组件的 UI 组件集。JavaScript 运行时 Bun 仍然保持着良好的发展势头,成为第二受欢迎的项目。Excalidraw 是一个手绘风格的开源虚拟白板项目,它也变得日益流行。
自从 shadcn/ui 在 GitHub 上第一次提交以来,到现在已经有一年了。该项目是一个可重用的组件集,可以复制和粘贴到应用程序中用于构建组件。这样就不用安装库了。根据 shadcn/ui FAQ 页面,其理念是:
… 赋予开发人员对代码的所有权和控制权,允许他们决定如何构建组件以及采用什么样式。Shadcn/ui 可以与支持 React 的框架一起使用,比如 Next js、Astro、Remix 和 Gatsby。
Bun 在最受欢迎的项目中排名第二。它是一个 JavaScript 运行时、包管理器、测试运行器和打包器,因其速度、效率和全面的工具包而备受关注。Bun 是用 Zig 编程语言开发的,旨在成为 Node.js 的替代品。
在前端框架列表中,React 继续保有其在 JavaScript 生态系统中的领先地位。其次,作为一个 JavaScript 库,Htmx 使开发人员能够仅仅使用 HTML 来创建交互式 Web 应用程序。它使用新属性扩展了 HTML,它们可以触发 HTTP 请求和处理响应数据,从而使开发人员不需要编写的大量 JavaScript 代码就可以实现现代 Web 应用程序。
在前端框架中排名第三的是 Svelte。Svelte 是一个基于编译器的前端框架,利用声明式语法和反应性来构建高性能、可维护的 Web 应用程序。备受期待的 Svelte 5 有望引入重大改进和诸多新特性,进一步增强开发体验和应用程序性能。
在 Vue 生态系统中,Vue 2 衰落,在努力升级到 Vue 3 后又获得了 Nuxt、Vuetify 和 PrimeVue 等框架的支持。Nuxt 被评为最受欢迎的 Vue 框架。
Next.js 在后端 / 全栈类别中依然占据主导地位。Next.js 14 于 2023 年发布,最显著的变化是 Turbopack Optimizations 缩短了页面初始加载时间,改进了性能,减少了代码。Server Actions Stability 现在已经稳定,Partial Prerendering(一种预渲染部分应用程序的技术)作为预览特性引入。Astro 凭借其创新性的静态网站生成和动态页面生成能力攀升至榜单前列。
在移动领域,Expo、Tamagui 和 Nativewind 致力于统一 Web 和本地开发体验,最大化代码重用,使其更方便 Web 开发人员使用。React Native 保持了它的主导地位,但其愈加独树一帜的解决方案表明了移动开发范式的演变。
原文链接:https://www.infoq.cn/article/itmVGcHEvphysb9Ad9F7