本文翻译自 https://dev.to/wasp/web-frameworks-we-are-most-excited-for-in-2024-4d15
感谢您的浏览！

介绍

2024年正向咱们走来，咱们怀着满腔热情为新的一年制订打算，摸索将来一年能够学习或实现的指标。此时此刻，正是探寻来年值得学习的框架、了解其性能和特色的最佳时刻。咱们以2023年JS 新星名单为指引，力求放弃主观公正的态度。对于每一个特色框架，咱们都将突出其最大的劣势，使您可能全面了解它们的长处，从而抉择适宜本人的框架进行尝试！

HTMX - 返璞归真

为谁而设：

  • 你心愿缩小JavaScript的编写量
  • 你心愿代码更简略，以超媒体为核心

HTMX在2023年迅速走红，过来一年间在GitHub上博得了大量星标。HTMX并非一般的JS框架。如果你应用HTMX，你将大部分工夫都花在超媒体的世界中，以与咱们通常对古代Web开发的JS密集型视角齐全不同的视角对待Web开发。HTMX利用HATEOAS（Hypermedia作为应用程序状态的引擎）的概念，使开发人员可能间接从HTML拜访浏览器性能，而不是应用Javascript。

此外，它还证实了通过公布令人惊叹的表情符号并以口碑作为次要营销伎俩，你能够取得人气和认可。不仅如此，你还可能成为HTMX的CEO！它吸引了许多开发人员尝试这种构建网站的办法，并从新思考他们以后的实际。所有这些都使2024年对于这个库的将来倒退充斥了激动人心的可能性。

Wasp - 全栈，开箱即用

为谁而设：

  • 你心愿疾速构建全栈利用
  • 你心愿在一个杰出的一体化解决方案中持续应用React和Node.js，而无需手动筛选堆栈的每一部分
  • 你心愿取得一个为React和Node.js预配置的收费SaaS模板—— Open SaaS

对于心愿简略轻松地全面管制其堆栈的工具的用户，无需再寻找！Wasp是一个有主意的全栈框架，利用其编译器以疾速简便的形式为你的利用创立数据库、后端和前端。它应用React、Node.js和Prisma，这些都是全栈Web开发人员正在应用的一些最驰名的工具。

Wasp的外围是main.wasp文件，它作为你大部分需要的一站式服务。在其中，你能够定义：

  • 全栈身份验证
  • 数据库架构
  • 异步作业，无需额定的基础设施
  • 简略且灵便的部署
  • 全栈类型平安
  • 发送电子邮件（Sendgrid、MailGun、SMTP服务器等）
  • 等等……

最酷的事件是？通过编译器步骤后，你的Wasp应用程序的输入是一个规范的React + Vite前端、Node.js后端和PostgreSQL数据库。从那里，你能够应用单个命令轻松将所有部署到Fly.io等平台。

只管有些人可能会认为Wasp的有主意立场是负面的，但它却是Wasp泛滥全栈性能的驱动力。应用Wasp，单个开发人员或小型团队启动全栈我的项目变得更加容易，尤其是如果你应用预制的模板或OpenSaaS作为你的SaaS终点。因为我的项目的外围是定义明确的，因而开始一个我的项目并可能在几天内创立本人的全栈SaaS变得非常容易！

此外，还有一点很酷的是，大多数Web开发人员对大多数现有技术的事后存在的常识依然在这里实用，因为Wasp应用的技术曾经成熟。

Solid.js - 一流的reactivity库 ↔️

适宜人群：

  • 如果你心愿代码具备高响应性
  • 现有的React开发人员，心愿尝试一种对他们来说学习曲线较低的高性能工具

Solid.js是一个性能很高的Web框架，与React有一些相似之处。例如，两者都应用JSX，采纳基于函数的组件办法，但Solid.js不应用虚构DOM，而是将你的代码转换为纯JavaScript。然而，Solid.js因其利用信号、备忘录和成果实现细粒度响应性的办法而更加闻名。信号是Solid.js中最简略、最出名的根本元素。它们蕴含值及其获取和设置函数，使框架可能察看并在DOM中的确切地位按需更新更改，这与React从新渲染整个组件的形式不同。

Solid.js不仅应用JSX，还对其进行了加强。它提供了一些很酷的新性能，例如Show组件，它能够启用JSX元素的条件渲染，以及For组件，它使在JSX中更轻松地遍历汇合变得更容易。另一个重要的是，它还有一个名为Solid Start的元框架（目前处于测试版），它使用户可能依据本人的爱好，应用基于文件的路由、操作、API路由和中间件等性能，以不同的形式渲染应用程序。

Astro - 动态网站之王

适宜人群：

  • 如果您须要一款优良的博客、CMS重型网站工具
  • 须要一个可能集成其余库和框架的框架

如果您在2023年构建了一个内容驱动的网站，那么很有可能您抉择了Astro作为首选框架来实现这一指标！Astro是另一个应用不同架构概念来怀才不遇的框架。对于Astro来说，这是岛屿架构。在Astro的上下文中，岛屿是页面上的任何交互式UI组件，与动态内容的大海造成鲜明对比。因为这些岛屿彼此独立运行，因而页面能够有任意数量的岛屿，但它们也能够共享状态并互相通信，这十分有用。

对于Astro的另一个乏味的事件是，他们的办法使用户可能应用不同的前端框架，如React、Vue、Solid来构建他们的网站。因而，开发人员能够轻松地在其以后常识的根底上构建网站，并利用能够集成到Astro网站中的现有组件。

Svelte - 简略而无效

适宜人群：

  • 您心愿学习一个简略易上手的框架
  • 谋求简洁且代码执行速度快的开发体验

Svelte是另一个尝试通过尽可能间接和初学者敌对的形式来简化和减速Web开发的框架。它是一个很容易学习的框架，因为要使一个属性具备响应性，您只需申明它并在HTML模板中应用它。 每当在JavaScript中程序化地更新值时（例如，通过触发onClick事件按钮），它将在UI上反映进去，反之亦然。

Svelte的下一步将是引入runes。runes将是Svelte解决响应性的形式，使解决大型应用程序变得更加容易。相似于Solid.js的信号，符文通过应用相似函数的语句提供了一种间接拜访应用程序响应性状态的形式。与Svelte以后的工作形式相比，它们将容许用户准确定义整个脚本中哪些局部是响应性的，从而使组件更加高效。相似于Solid和Solid Start，Svelte也有其本人的框架，称为SvelteKit。SvelteKit为用户提供了一种疾速启动其由Vite驱动的Svelte应用程序的形式。它提供了路由器、构建优化、不同的渲染和预渲染形式、图像优化等性能。

Qwik - 十分快

适宜人群：

  • 如果您想要一个高性能的Web利用
  • 现有的React开发人员，心愿尝试一种高性能且学习曲线平缓的框架

最初一个但同样重要的框架是Qwik。Qwik是另一个利用JSX和函数组件的框架，相似于Solid.js，为基于React的开发人员提供了一个相熟的环境，以便尽快上手。正如其名字所表白的，Qwik的次要指标是实现您应用程序的最高性能和最快执行速度。

Qwik通过利用可恢复性（resumability）的概念来实现其速度。简而言之，可恢复性基于在服务器上暂停执行并在客户端上复原执行而无需从新播放和下载全副利用程序逻辑的想法。这是通过提早JavaScript代码的执行和下载来实现的，除非有必要解决用户交互，这是一件十分棒的事件。它使整体速度进步，并将带宽升高到相对最小值，从而实现近乎霎时的加载。

论断

在咱们所提及的所有框架和库中，最大的共同点是它们的相熟度。每个框架和库都试图以构建在以后常识根底上的形式吸引潜在的新开发者，而不是做一些全新的事件，这是一个十分棒的理念。

当然，还有许多咱们未在整篇文章中提及但值得一提的库和框架。例如，Angular 除了新的标记和文档外，还包含信号和新的控制流。还有 Remix，它减少了对 Vite、React Server Components 和新的 Remix SPA 模式的反对。最初，咱们不能遗记 Next.js，它在过来几年中已成为 React 开发者的默认抉择，为新的 React 性能铺平了路线。