State of Frontend 2024 报告解读
● 《State of Frontend 2024》年度报告，基于全球139个国家6,288份开发者的真实反馈编制，它不仅仅是一份数据报告，更是前端技术浪潮的缩影，记录了过去一年的辉煌成就，更预示着未来的无限可能。在这里，你将看到React、Vue.js等老牌框架如何持续引领潮流，又将目睹Svelte、HTMX等新兴势力如何异军突起。报告中的每一个数据、每一项分析都凝聚着前端社区的智慧与共识。各位前端技术的探索者与创新者，让我们共同走进这份报告，共同探索前端技术的无限可能，把握技术脉搏，引领未来创新。
● 《State of Frontend 2024》报告详情
全面概述了2024年前端开发领域的现状、趋势、挑战以及未来的发展方向。
● 1.报告概述
● 报告背景
● 该报告由Aleksandra Dąbrowska主编，是第三次发布。报告基于来自139个国家的6,288名开发者、工程师和技术爱好者的反馈，涵盖了前端开发的多个方面
● 行业分布
● 受访者主要来自IT服务、金融、零售和电子商务等领域，显示出前端开发在这些行业的广泛应用。其中，IT 服务业以 29.7% 领先，其次是金融、银行和金融科技 (13.9%) 以及零售和电子商务 (11.6%)。
● 2.团队与技术
● 1)团队组成
● 前端开发团队中，全栈开发者占比最高（33.5%），其次是高级前端开发者（32.2%）。
●
● 2)框架与库
● React是最受欢迎的框架（69.9%），其次是Vue.js（44.8%）。在渲染框架方面，Next.js和Nuxt分别占据前两位。Svelte和HTMX等新型框架受到关注，开发者对其表现出浓厚兴趣，Svelte 正在吸引大量开发人员（43.6% 的人希望学习它）。社区对学习框架的倾向有变化，如对Svelte学习兴趣较高（43.6%）。开发者逐渐对Angular.js 失去兴趣。
● Next.js
● Nuxt.js
● Svelte
●
● Next、Nuxt，都是基于Vue的项目样板
● 3)工具和库
● Redux和Redux Toolkit在状态管理库中占比较高，date-fns在日期管理库中表现出色，Zod因TypeScript集成优势受关注。
●
● 4)数据获取工具
● Axios (73.6%)或原生获取API (72.4%)常用，前端生态系统的成熟度促使人们倾向于使用成熟、可靠的库，而不是较新的、未经验证的库
●
● 5)托管方式
● Vercel（36.2%）和AWS（32%）受青睐，Netlify崛起，自托管也有一定比例，反映不同托管方案的特点和适用场景。
●
● Vercel (36.2%) 和 AWS (32%) 引领了偏好，反映出对托管云托管解决方案的强烈倾向。React 正在推动前端的采用，随着工作负载的成熟，越来越多的工作负载选择 AWS，因为它具有强大的功能、可扩展性、易于与开发工作流集成以及集成能力，尤其是对于现代 Web 应用程序而言。
● AWS 可能是无服务器运动的先驱，但所有功劳都归功于 Netlify (20.7%) 在前端开发人员方面的惊人增长。 随着工作负载成熟到全栈要求，迁移到 AWS 以获得更好的定价、确定性和可用性仍然具有良好的商业意义。
●
● 6)持续集成（CI）
● 79.9%开发者使用CI，GitHub Actions最流行，Jenkins虽过时但仍有一定份额，介绍不同CI工具的情况和选择建议。
●
● 7)微前端
● 微前端采用率从2022 年75.4%大幅下降到2024 年的23.6%
●
●
● 8)包管理器
● NPM最常用（56.6%），Yarn和PNPM也有一定用户，NPM因与Node.js集成紧密占主导。
●
● 9)JavaScript运行时
● Node.js主导（96.6%），Node.js因稳定性、生态丰富和社区支持强大而受欢迎。
●
● 3. 开发者体验与用户体验
● TypeScript
● 现在有 90.6% 的开发人员使用 TypeScript，高于 2022 年的 84.1%。超过一半的开发人员 (53.1%) 相信 TypeScript 已成为新的 Web 标准，高于 2022 年的 43%。开发人员越来越依赖 TypeScript，但并非将其作为编译器或构建过程的一部分。它的主要用途是作为类型检查器，为 IDE、linters（通过typescript-eslint等项目）和开发人员体验功能提供支持。
●
● TypeScript 超越 Javascript，成为新的前端标准
● 浏览器技术
●
● Fetch 的使用率达到 82.1%， 它足够简单，大多数用户不需要外部依赖项即可发出请求。
● 本地优先：从存储 API（包括本地存储和会话存储）到 IndexedDB 和 Service Workers，将数据存储在更靠近客户端的地方正成为一种越来越流行的技术，用于加载速度更快、行为更像原生移动应用的应用程序。 虽然一些开发人员完全接受这些 API 的“本地优先”方法，但其他开发人员则使用它们通过近乎即时的加载时间来增强用户体验。
●
●
● PWA
● 渐进式Web应用（Progressive Web App，PWA）是一个使用web平台技术构建的应用程序，但它提供的用户体验就像一个特定平台的应用程序。在移动端利用标准化框架，让网页应用呈现和原生应用相似的体验。
● 20% 的受访者在其移动应用中使用 PWA ，这是继 React Native 和原生开发之后的第三大热门选择。苹果最初在欧盟取消了 iOS 上的 PWA 功能，这一决定引发了网络开发社区的强烈反对。苹果17.4beta版本，Safari 不再支持 PWA。
●
● 设计框架
● 说明
● shadcn/ui (28.1%) 位居榜首，Shadcn 将实现文件直接复制到用户的项目中，允许根据需要自定义 TailwindCSS 类。
● Material UI (MUI) 是第二受欢迎的设计框架。MUI 是一个“企业框架”，提供可访问、可主题化、高度可定制的组件，性能强大。
● Bootstrap起源于 Web 2.0 时代，只需要一个库和一个 CSS 文件，不要因为 Bootstrap 已经存在了一段时间就低估它。
● Ant Design (7.3) 稳居第五位。这是一个流行的组件系统，多年来发展势头强劲，非常适合企业领域。
●
● 样式工具
● 说明
● 纯 CSS仍然非常受欢迎，74.8% 的受访者使用并喜欢它。
● Sass/SCSS也是一个强有力的竞争者，占比71.8% 。许多开发人员更喜欢 Sass/SCSS 提供的增强功能和预处理功能。
● Tailwind CSS 的使用率和批准率高达 66.7% 。尤其是在 React 和 Next.js 生态系统中，它与现代组件驱动的开发和设计系统相一致，其中样式是在组件中定义的，而不是在单独的样式表中定义的。
●
● 代码编辑与版本控制
● Visual Studio Code是最受欢迎的桌面代码编辑器（75.1%），GitHub是版本控制的首选（77.9%）
● Visual Studio Code的成功取决于两个关键支柱：免费和提供庞大的扩展生态系统。
●
● 测试与质量管理
● 大多数测试工作由开发者或开发者与QA团队共同完成（87.4%）。Jest（68.2%）和 Cypress（42.6%）仍然是最受欢迎的测试工具
●
● 设计工具
● 在设计工具方面，Figma (86.9%) 已成为设计创作的事实上的标准。 随着开发者模式和流行的 AI 插件的加入，Figma 继续创新，简化了将设计转换为代码的过程。
●
● 低代码
●
● 调研中对低代码平台使用的并不多，但图中仅限于国外的产品，对于中国的低代码产品（BAT）没有提及
● 对无代码平台的使用更少
● 构建工具
● 构建工具
● Vite 在开发者中的满意度很高，82.4% 的人表示赞同。 它的吸引力源于其速度、快速启动时间和最低配置要求，使其成为 Webpack 的首选替代方案。Vite 利用 esbuild 在开发过程中进行快速转译和热重载，从而提高了其整体效率。
● 虽然 Webpack 的使用率与 Vite 相近，但 Vite 的用户反馈绝大多数都是积极的体验。相比之下，Webpack 的反馈褒贬不一，只有 44% 的用户表示满意，38.5% 的用户认为它很麻烦，因为它很复杂，配置也很有挑战性。
● 语法检测
● ESLint（89.3%） 和Prettier（87.5%） 继续在代码检查和格式化领域占据主导地位。
● 网站建设工具
● WordPress仍然是占据主导地位的网站构建工具。
●
● 4. 新兴趋势与技术
● 人工智能
● 75.8%的受访者表示在日常工作中使用AI工具，ChatGPT和GitHub Copilot是最受欢迎的AI工具。AI在代码助手、知识来源和代码审查等方面发挥重要作用。68.9%的开发者希望引入人工智能，主要用于支持开发者的工作，比如代码助手。
●
●
●
● 无障碍性
● 大多数开发者通过语义化HTML、替代文本等方式确保应用的无障碍性，但仍有改进空间。
●
● 未来趋势
● 组件化开发、全栈框架、开发者体验和性能优化被认为是未来将流行的趋势。而GraphQL、微前端和在线页面构建器等技术的受欢迎程度可能下降。
● 趋势上升
● 用户体验（90.4%）
● 组件化开发
● 全栈框架
● 开发者体验
● 性能优化
● 趋势下降
● GraphQL
● 为前端提供仅查询所需数据
● GraphQL 的复杂性通常要求开发人员具有全栈理解能力
● 微前端
● 在线页面构建器
●
● 未来趋势
● 在当今快速迭代的软件开发领域，一系列新兴的技术趋势正逐渐崭露头角，成为业界瞩目的焦点。组件化开发、全栈框架、开发者体验以及性能优化被公认为未来几年内将引领潮流的关键趋势。这些趋势不仅反映了技术发展的内在逻辑，也体现了市场对于更高效、更灵活开发解决方案的迫切需求。
● 部分领域趋势上升
● 用户体验以高达90.4%的认可度脱颖而出，成为不可忽视的重要趋势。随着用户对于产品体验要求的日益提升，优化用户体验已成为开发者们共同追求的目标。同时，组件化开发凭借其高度的模块化和可复用性，正逐步改变着软件开发的传统模式。全栈框架则以其集成的便捷性和开发的高效性，赢得了越来越多开发者的青睐。此外，开发者体验和性能优化也被视为未来不可或缺的技术要素，它们将共同推动软件开发质量的全面提升。
● 部分领域趋势下降
● 与此同时，也有一些技术面临着受欢迎程度下降的挑战。GraphQL，这一曾经备受推崇的前端数据查询技术，虽然能够为前端提供仅查询所需数据的便利，但其复杂性往往要求开发人员具备全栈的理解能力，这无疑增加了学习和应用的难度。因此，GraphQL的受欢迎程度在未来可能会有所下滑。此外，微前端和在线页面构建器等技术也面临着类似的困境，它们或因技术实现的复杂性，或因市场需求的转变，而逐渐失去了往日的光环。
● 综上所述，软件开发领域的未来趋势呈现出多元化、复杂化的特点。面对这些变化，开发者们需要保持敏锐的洞察力，紧跟技术发展的步伐，不断学习和掌握新技术，以适应不断变化的市场需求。
