作者| 内夫·艾玛达梅尔霍·阿特里

译者| 学文

策划|丁晓云

希腊哲学家赫拉克利特认为，变化是生活中唯一不变的。本声明适用于我们的个人生活、行业和专业领域。

尤其是在前端开发领域，变化并不少见，新技术、发展趋势、库、框架不断涌现。最近发生的几件事正在改变开发人员构建网站和Web 应用程序的方式，包括支持服务器端渲染的Angular 17 的发布、Next.js v14 的发布以及TypeScript 的广泛采用。

跟上前端生态系统的变化可能很困难，但作为一名专业人士，保持最新的技能将对你的工作有所帮助。想知道明年前端领域会发生什么吗？请继续阅读。

趋势一：新的样式解决方案和组件库将持续涌现

开发者在选择网站风格解决方案方面非常丰富。除了众多基于Angular、React 和Vue 的组件库之外，还有40 多个CSS 框架和40 多个CSS-in-JS 库可供选择。

2023 年发布了新的样式解决方案，例如Shadcn UI、Ark UI、Panda CSS 和StyleX（来自Meta）。除此之外，还有Lemon Squeezy 的开源React UI 库Wedges。这是在撰写本文的前几天刚刚发布的。

随着开发人员和开源社区继续分享他们独特的UI 设计和网站构建方法，我们预计未来会出现更多网站风格的解决方案。

除了不断发布新风格的解决方案外，未来我们还可以期待以下几个方面：

对现有解决方案的持续更新。 CSS-in-JS 解决方案已被弃用，因为它们会增加运行时开销和构建包大小，并且不能与SSR 很好地配合。 Open Props 将接管Tailwind CSS 的王座。根据这篇文章《2023 年 CSS 现态》的数据，开发者对Tailwind CSS的兴趣从2022年的50.1%下降到2023年的47%。与此同时，对Open Props 的关注度从2022 年的不到10% 上升到2023 年的60%。

趋势二：利用 AI 来增强开发流程

毫不夸张地说，生成式人工智能席卷了全球许多行业。它还将彻底改变Web 开发的格局以及许多开发人员构建网站的方式。

Vercel 发布的v0 就是一个活生生的例子。这是一个根据提示词生成用户界面的工具。例如，您可以通过提示词让v0创建一个电子商务风格的仪表板页面。下图是v0的输出。

除了v0之外，Vercel还致力于推动AI的应用。他们发布了人工智能SDK，使开发人员可以轻松构建人工智能驱动的应用程序。目前，SDK 下载量每周超过85,000 npm，这是人们注册Vercel 创建API 应用程序的原因之一。

人工智能不会夺走我们的工作，但越来越多的开发人员正在将其纳入他们的开发流程。根据Retool的《2023 年 AI 现状》报告，自2022年以来，57%的开发者减少了Stack Overflow的使用，10%的开发者由于ChatGPT和GitHub Copilot而停止使用Stack Overflow。

越来越多的开发人员正在使用AI 来简化开发过程，GitHub 的Copilot 和Sourcegraph 的AI 编码助手Cody 就是很好的例子。

趋势三：SSR 和 SSG 两种框架之间的竞争将会愈演愈烈

两种渲染方法最近因其SEO 和性能优势而受到广泛关注：服务器端渲染(SSR) 和静态站点生成(SSG)。随着越来越多的开发人员和企业采用SSR 和SSG 渲染解决方案来满足SEO 和性能需求，支持这两种渲染方法的框架之间的竞争加剧。

最近关于SSR/SSG 框架讨论的一个例子是比较Next.js 和Remix 的Tech Twitter 线程。首先Kent C. Dodds 发表了一篇题为“为什么不使用Next.js”的文章，随后Vercel 的Lee Robinson 发表了一篇题为“为什么应该使用Next.js”的文章。

在技术选择方面，没有一种万能的工具，只有最适合该工作的工具。然而，可以毫不夸张地说，Next.js 目前在竞争中具有优势。

根据Stack Overflow 2023 年研究数据，Next.js 是第六大最受欢迎的Web 框架，领先于Nuxt.js、Gatsby 和Remix，分别排名第21 位、第24 位和第30 位。根据Stack Overflow 2022 年的调查数据，Next.js 仅排名第11 位。 Next.js 的受欢迎程度只会随着时间的推移而增加。

凭借RSC（React 服务器组件）支持、内置图像和字体优化以及服务器操作等功能，我认为其他SSR/SSG 框架不会很快超越它。然而，随着这些框架的功能不断迭代和更新，我们预计这场战斗还将继续。

此外，我认为Astro 将成为继Next.js 之后的下一个热门框架。根据Netlify 的《2023 年 Web 开发现状》 报告，Astro 使用率和满意度增长最快。最令人印象深刻的是，使用率几乎翻了一番，使用满意度从2022 年的4.5 上升到2023 年的6.8。

以下是NPM 提供的这些框架的每周下载数据。

Next.js: 5,037,121Nuxt: 571,196Gatsby: 316,779SvelteKit: 306,599Astro: 197,435Quasar: 111,975Remix: 22,676

趋势四：前端、后端和全栈开发之间的界限将越来越模糊

在Web 开发的早期，开发人员遵循“关注点分离”原则。因此，前端、后端和全栈开发人员被分配到不同的系统和领域。

然而，随着时间的推移，这些界限变得越来越模糊。

Next.js 提供路由处理程序。这允许您执行处理HTTP 请求、从数据库检索数据、运行服务器端逻辑以及从数据库检索数据等任务。 React 18 包含RSC（React 服务器组件），它允许您在服务器端而不是客户端上预渲染应用程序并运行数据库查询，从而进一步模糊了两者之间的界限。这意味着您可以将数据库查询功能直接写入React 组件中。 Next.js 还发布了服务器操作功能。这允许您直接在客户端定义操作服务器上数据的函数。

这些发展，加上Supabase、Appwrite 和Xata 等后端即服务(BaaS) 解决方案的出现和流行，使前端开发人员更容易创建全栈应用程序。有了这些新的工具和技术，随着前端开发人员不断探索后端和全栈开发，我们可以期待看到更多跨领域专家的出现。

趋势五：越来越多的人关注无障碍性

目前有超过10 亿人患有某种形式的残疾，无障碍设计不能只是开发过程中的事后想法。以下是关注可访问性的一些好处：

吸引更广泛的受众：无障碍网站可供各种残障人士使用，极大地扩大了您的潜在受众。提高您的搜索引擎优化：许多可访问性实践可以提高您的搜索引擎优化，帮助您的内容排名更好，更容易被发现。帮助遵守法律：许多当地法律要求网站可访问，因此创建可访问的网站可以帮助您避免违法和招致罚款。增强用户体验：设计辅助功能通常可以改善所有用户的整体体验，而不仅仅是残障人士。积极的品牌形象：无障碍工作体现了社会责任和包容性，可以对组织的声誉产生积极影响。

尽管几十年来对网络可访问性的支持有所改善，但我们距离完全可访问的网络的理想还很远。截至2022 年，只有3% 的互联网可供残疾人使用。尽管这一比例出人意料地低，但互联网可及性正在逐步稳定地改善。

WebAIM 调查了100 万个网页并发布了《2023 年无障碍性报告》 个。该报告表明，越来越多的开发人员和组织开始认识到可访问性的重要性。以下是该报告的一些统计数据：

ARIA 代码使用量较2022 年增加了29%，较2019 年几乎翻了两番。 100 万个主页中有80% 使用ARIA，高于2022 年的74.6%。 89.8% 的主页具有有效的HTML5 文档类型，高于2022 年的86.1% 和2021 年的79.1%。

根据Software House 发布的《2022 年前沿技术现状》，63% 的开发者预测可访问性将在未来几年内变得普遍（见下图）。随着越来越多的开发者和公司加大力度提高网站的可访问性，WebAIM 的2024 年报告预测可访问性投诉将减少，可访问网站将增加。

趋势六：VS Code 将继续占据最受欢迎 IDE 的宝座

VS Code 于2019 年发布，现已发展成为最受欢迎的代码编辑器之一，可与Vim、IntelliJ 和Webstorm 等IDE 相媲美。根据Stack Overflow 2023 年的调查数据，VS Code 仍然是开发者中最受欢迎的IDE。 Software Home 的2022 年前端现状调查还显示，VS Code 是开发人员最喜欢的代码编辑器，占74.4%。

为什么开发人员更喜欢VS Code？

支持100 多种语言。有一个巨大的插件市场。前端开发人员应该熟悉最流行的VS Code 扩展，例如Live Server、React、Next.js 片段、Live Sass 编译器和HTML 结束标记标签。高度可定制。

VS Code 的更新速度非常快，频繁提示用户安装更新就证明了这一点。鉴于其当前的步伐和发展轨迹，我们预计VS Code 将继续迭代扩展其功能，并在2024 年及以后保持其作为首要IDE 的地位。

趋势七：将会有更多人使用 TypeScript

关于是否使用TypeScript 在开发生态系统中的意见仍然不一，但大多数意见支持TypeScript。事实上，更多的公司和开源社区将把他们的代码库转移到TypeScript。例如，Stripe 将其最大的JavaScript 代码库（大约370 万行代码）迁移到了TypeScript。

根据Stack Overflow 的开发者调查，TypeScript 的受欢迎程度从2022 年的34.83% 上升到2023 年的38.87%。 TypeScript 的使用已经变得如此流行，以至于许多开发人员在其文档中都有一个按钮可以在TypeScript 和JavaScript 代码之间切换。此外，在某些情况下，文档可能仅提供TypeScript 代码。

TypeScript 不会很快取代JavaScript，而且可能永远不会，但随着越来越多的团队将其代码库迁移到TypeScript 或直接使用TypeScript 启动新项目，我们预计TypeScript 的采用将变得越来越普遍。

下图来自2022 年前端现状调查，显示了开发者对TypeScript 未来的看法。

结论：为你的 2024 做好准备

前端开发领域随着新技术、新框架、新趋势的出现而不断发展。适应快节奏的变化可能很困难，但跟上最新趋势可以促进您的职业发展并保持您的技能与时俱进。

根据本文重点介绍的趋势，以下是为2024 年做好准备的一些技巧。

尝试新风格的解决方案，如Ark UI、Open Props、Shadcn UI，并熟悉它们。了解如何将GitHub Copilot 等AI 工具集成到日常开发工作流程中。如果你还没有开始学习SSR/SSG框架，那就开始学习吧。考虑从Astro 或Next.js 开始。考虑使用BaaS 平台（例如Xata 或Supabase）构建全栈应用程序。在您从事的每个项目中倡导无障碍。成为VS Code 专家、学习插件并提高工作效率。开始学习TypeScript。它可能会在开发行业中使用一段时间。原文链接：https://www.infoq.cn/article/28AAMVMBA16EXo2ux5QO

版权声明：本文由今日头条转载，如有侵犯您的版权，请联系本站编辑删除。