2024 前端生态报告
大约 7 分钟约 2140 字
最近，tsh.io 发布了一份关于 2024 年 前端生态的报告，其中包含了一些有趣的数据和趋势。
框架
前端框架
- React 和 Vue.js 在使用率和喜爱度上表现出色，仍是市场的主流选择。
- Svelte 和 HTMX 展现出很高的学习兴趣，可能在未来成为更加流行的选择。
- Angular 系列 虽然仍有稳定的用户基础，但学习兴趣较低。
- 新兴框架（如 Qwik、Lit）显示了潜在的增长空间，但需要更多的推广和生态完善。
- 边缘化框架（如 Ember、Phoenix）用户基础薄弱，未来可能逐渐退出主流市场。
渲染框架
- Next.js 依然是前端开发的首选工具，拥有极高的用户满意度和市场接受度。
- Astro 和 SvelteKit 的学习意向很高，特别是 SvelteKit，未来可能成为新兴热点。
- Nuxt 在 Vue.js 生态中表现稳定，但在整体市场上学习意向稍逊于 SvelteKit 和 Astro。
- Remix 虽然用户群较小，但学习意向表明其潜在发展前景广阔。
- Gatsby 的热度和满意度明显下降，可能难以保持市场竞争力。
- Docusaurus 的关注度较低，但在特定领域（文档生成）仍有一席之地。
库
验证库
- Zod 是当前最受欢迎的工具，使用率高，评价好，并且对未来用户有较大吸引力。
- 传统工具如 Joi 和 Yup 依然有一定的用户基础，但 Yup 在学习意向上表现更强。
- 新兴工具如 Valibot 开始受到关注，但目前影响力有限。
- 特定生态的工具如 Ajv 和 class-validator 主要用于特殊场景，使用范围较小。
日期管理库
总结
- 最受欢迎：date-fns 是当前的主流选择，其功能全面且模块化设计深受开发者喜爱。
- Moment 的余热：尽管官方不再推荐，但 Moment 依然有广泛的用户基础，但其负面评价也较多。
- 轻量替代品：Day.js 提供了类似 Moment 的 API，同时更加轻量，逐渐受到开发者青睐。
- 新兴工具：Luxon 功能强大，学习意愿高，但目前尚未被广泛采用。
- 关注度较低的工具：Date.js 和 Luxon 在无意见比例上排名靠前，说明它们的市场影响力较低。
建议：
- 如果项目需要模块化和高性能，可以选择 date-fns。
- 如果倾向于轻量级解决方案，Day.js 是不错的选择。
- 对于需要处理复杂国际化或时区功能的场景，可以考虑学习 Luxon。
状态管理库
- 流行趋势：React Context API 是目前最受欢迎的简单状态管理工具，Redux Toolkit 和 Zustand 是复杂场景中更现代化的选择。
- 工具定位：
- Redux 和 Redux Toolkit 适合复杂场景，但 Toolkit 更适合现代开发。
- React Context API 和 Zustand 是轻量场景的热门选择。
- Vue 社区用户倾向于 Pinia。
- 新兴工具：Zustand 和 Jotai 等轻量级库越来越受到关注，但 Jotai 目前的社区影响力较弱。
工具库
- 流行工具：Lodash 是最受欢迎的工具库，功能丰富且应用场景广泛。
- 过时工具：jQuery 和 Underscore 的使用率下降，更多用户转向现代工具。
- 新兴工具：Immer 和 Ramda 的用户群体较小，但对特定需求的开发者可能有吸引力。
- 特定领域工具：RxJS 在响应式编程中有较高认可度，但学习曲线限制了它的普及。
数据请求库
- 主流工具：Axios 和 Native Fetch 是最受欢迎的工具，分别占据了 73.6% 和 72.4% 的「Used and liked」。
- 新兴趋势：tRPC 和 TanStack Query 逐渐受到关注，尤其是 tRPC 的未来学习兴趣高达 29.8%。
- 小众工具：ky 和 ApolloClient 虽然功能强大，但在用户中的使用率较低。
- 有潜力的工具：SWR 和 TanStack Query 在 React 生态中有较大潜力。
托管平台
Vercel, AWS and… Netlify 是目前最受欢迎的云托管平台。也有很大一部分人使用自己的服务器。
CI（持续集成）
对于独立开发者来说，使用 GitHub Actions 是最佳选择。
若想要独立的 CI/CD 平台，可以选择使用 Jenkins 或者 GitLab CI 提供的自托管替代方案。
微前端
采用率从 2022 年报告使用微前端的受访者中 75.4% 显著下降至 2024 年的 23.6%。这一急剧下降表明行业在前端架构方面的转变。
许多人意识到微前端不仅需要技术知识，还需要组织和文化的变革，而他们并未做好准备。另一个关键因素是对服务器端渲染（SSR）和静态网站生成（SSG）架构的投资不断增加，这些架构包含类似的概念。
- 主流工具：Webpack 5 Module Federation 和 Single SPA 是微前端领域的两大主流解决方案，分别占据了 51.8% 和 35.5% 的比例。
- 次主流工具：Open Components、SystemJS 和 Bit 在特定场景下有一定用户基础，但市场占比明显低于前两者。
- 小众工具：Qiankun、Luigi 和 Piral 等工具的使用比例较低，但在特定社区和应用场景中仍有价值。
- 创新空间："Other" 类别显示了开发者在微前端领域的多样化尝试，可能包括定制解决方案或尚未普及的新工具。
包管理器
JavaScript 运行时
Node: 稳定、生态丰富、社区活跃。
然而，其他 JavaScript 运行时，如 Bun（10%）和 Deno（2.6%），开始开辟自己的市场。
Bun 作为领先替代品的地位值得注意。它专注于其惊人的速度和几乎完全的 Node.js 兼容性，尽管还未达到 100%。Bun 还引入了内置包管理器、原生 TypeScript 和 JSX 支持以及独特的 API。
Deno 由 Ryan Dahl（Node.js 的原始开发者）创建，走上了与 Bun 类似的道路。尽管其最初通过 URL 导入依赖项的方法可能减缓了采用速度，但 Deno 推出其包注册表 JSR（npm 的替代品）标志着战略转变。随着 Deno2 的到来，观察它如何发展以及社区的反应将会很有趣。
TypeScript
浏览器技术
PWA（渐进式 Web 应用）
设计系统
Style 工具
测试
代码管理
低代码/无代码
构建工具
操作系统
AI 工具
未来趋势
