js2024.yml

locale: zh-Hans
translations:
  ###########################################################################
  # General
  ###########################################################################

  - key: general.results.description
    t: 2024 年度 JavaScript 生态系统最新趋势调查报告。

  ###########################################################################
  # Survey Intro
  ###########################################################################

  # JS 2024

  - key: general.js2024.survey_intro
    t: >
      在我们忙于决定下一个前端库的选择时，JavaScript 本身也在经历着自身的演变。


      新的 TC39 提案正在社区中引起轰动，而其他提案已经处于即将在各大浏览器中实施的边缘。同时，TypeScript 的流行使得未来某个时候原生类型支持的可能性变得真实。


      可以肯定的是——尽管 2024 年的 JavaScript 仍然感觉很熟悉，但我们无法保证五年后我们还能对所写的语言有同样的感受。


      在此之前，您可以通过参与今年的 JavaScript 现状调查来帮助我们绘制未来的路径！

  ###########################################################################
  # Survey FAQ
  ###########################################################################

  - key: faq.how_long_will_survey_take_js2024
    t: 完成调查需要多长时间？
  - key: faq.how_long_will_survey_take_js2024.description
    t: >
      根据您回答的问题数量（所有问题均可跳过），填写调查大约需要 15-20 分钟。

  - key: faq.survey_design_js2024
    t: 这项调查是如何设计的？
  - key: faq.survey_design_js2024.description
    t: >
      这项调查是通过一个[开放式设计过程](https://github.com/Devographics/surveys/issues/252)设计的，涉及浏览器供应商和 Web 开发社区。

  - key: faq.results_released_js2024
    t: 结果什么时候发布？
  - key: faq.results_released_js2024.description
    t: 调查将从 2024 年 11 月 13 日持续到 2024 年 12 月 3 日，调查结果将在之后不久发布。

  ###########################################################################
  # Introduction
  ###########################################################################

  - key: introduction.js2024
    t: |

      <span class="first-letter">让</span>我们好好想想：2024 年的三大前端框架都是十多年前推出的。

      诚然， 这三个框架已经经历了很大的演变， 而 2014 年的开发模式在如今看来已经显得相当陈旧。 但考虑到 JavaScript 生态系统以不断变化的特点而闻名， 能够发现某些事物依然保持不变， 这确实令人欣慰 。

      说到不变， Vite 和 Vitest 仍然在各大排行榜中高居榜首， 引领着一代更新、更简单的工具发展 。

      另外， 我们新增了一个**元数据**附录， 它将为您提供关于调查受访者和调查本身的更多信息 。 别忘了，您还可以使用**查询构建器**将这些新变量应用到其他图表中 。

      说了这么多， 让我们来看看今年 JavaScript 的最新动态吧 ！

      <span class="conclusion__byline">– Sacha Greif</span>

  ###########################################################################
  # Tshirt
  ###########################################################################

  - key: sections.tshirt.title
    t: T 恤

  - key: sections.tshirt.description
    t: |
      ## 通过购买 JavaScript 现状 T 恤支持本次调查

      在糟糕的视频质量、笨重的录像带和需要倒带之间，VHS 时代并没有太多值得怀念的地方。但我们确实怀念那些曾经装饰空白 VHS 录像带的令人惊叹的 90 年代视觉效果。

      但现在，多亏了才华横溢的 Christopher Kirk-Nielsen，你可以在享受所有这些复古的酷炫风格的同时，也庆祝你对 JavaScript 的热爱！

  - key: tshirt.about
    t: 关于这件 T 恤

  - key: tshirt.description
    t: |
      我们使用高品质、超柔软的三混纺面料制作修身款式，由我们的合作伙伴 Cotton Bureau 负责印制。

  - key: tshirt.getit
    t: 立即购买

  - key: tshirt.price
    t: 32 美元 + 运费

  - key: tshirt.designer.heading
    t: 关于设计师

  - key: tshirt.designer.name
    t: Christopher Kirk-Nielsen

  - key: tshirt.designer.bio
    t: |
      Chris 原籍法国，现居美国，他不仅是一位出色的前端开发者，还是一位才华横溢的插画师，专注于复古风格的视觉设计。事实上，我们强烈建议您也去看看他的[其他 T 恤设计](https://chriskirknielsen.com/designs)！

  ###########################################################################
  # Sections
  ###########################################################################

  - key: sections.user_info.description.js2024
    t: |
      今年共有 **14,015** 名参与者参加了调查。


      今年第一次，除了通常的人口统计数据点外，我们还询问了职称，这导致了一些关于这些职称如何与收入、年龄和性别相关的有趣发现。

  - key: sections.features.description.js2024
    t: |
      JavaScript 的新 Set 和 Object 特性虽然还没有普遍采用，但它们将为开发者提供更好的解决方案，减少了对第三方工具库的依赖。


      我们现在还会在可用时显示每个功能的基线状态 （[Baseline]()）：绿色表示“普遍可用”，蓝色表示“新推出”，白色表示“有限可用”。

  - key: sections.libraries.description.js2024
    t: |
      虽然 JavaScript 生态系统仍然相当分散，但很高兴看到一些最常用的库也是最受赞赏的。


      请务必看看我们新的分组和分类选项，以找出哪些库获得最多的喜爱......或最少的！

  - key: sections.other_tools.description.js2024
    t: |
      这年AI工具在调查中首次亮相，而尽管目前这个领域仍被几名领先者占据，但看到已经存在的选项数量令人印象深刻！

  - key: sections.usage.description.js2024
    t: |
      今年的调查显示，普通受访者使用 TypeScript，都是通过构建步骤运行代码，并且还没有完全加入 AI 的行列。

  - key: sections.resources.description.js2024
    t: |
      虽然不乏精彩的课程、播客和周刊，但视频内容仍在继续占领 JavaScript 内容的半壁江山。


      西班牙语的内容生态也值得强调，因为它对英语在编程世界的传统主导地位提出了有价值的挑战。

  - key: sections.awards.description.js2024
    t: |
      您能多*快*猜出哪个项目将在每个类别中拔得头筹？
  ###########################################################################
  # Charts
  ###########################################################################

  - key: options.features_categories.language
    aliasFor: sections.language.title
  - key: options.features_categories.browser_apis
    aliasFor: sections.browser_apis.title
  - key: options.features_categories.other_features
    aliasFor: sections.other_features.title

  ###########################################################################
  # Notes
  ###########################################################################

  - key: blocks.gender.note
    t: |
      如果你有兴趣了解更多，我们[写了一篇博客文章](https://dev.to/sachagreif/is-our-survey-biased-against-women-49oj)，讨论了调查中的性别动态。

  - key: blocks.source.note
    t: >

      此图表汇总了各种推荐来源、URL 参数和自由形式答案。

      - State of JS: [State of JS](https://stateofjs.com) 邮件列表。

      - State of CSS: State of CSS 邮件列表；也匹配 `email`, `by email` 等。

      - Work: 匹配 `work`, `colleagues`, `coworkers` 等。

  ###########################################################################
  # Awards
  ###########################################################################

  - key: award.feature_adoption_delta_award.comment
    t: 随着 2022 年 **{value}** 的发展，**Top-level await** 已迅速成为 JavaScript 不可或缺的一部分。

  - key: award.tool_usage_delta_award.comment
    t: |
      就像它的名字那样，**Vite** 继续以创纪录的速度增长，使用率逐年增加 **{value}** ！

  - key: award.tool_satisfaction_award.comment
    t: Vitest 位居榜首， **{value}** 的开发者愿意再次使用它！

  - key: award.tool_interest_award.comment
    t: 在 Vite 生态系统中，今年 **Rolldown** 是开发人员最感兴趣的技术，关注比例为**{value}** 。

  - key: award.most_write_ins_award.comment
    t: Angular 元框架 **Analog** 被提及 **{value}** 次，是受访者填写最多的库。

  - key: award.most_commented_tool_award.comment
    t: Angular 也许不是最新兴的技术，但它仍然是热门话题，有 **{value}** 位受访者发表了评论!

  - key: award.most_loved_tool_award.comment
    t: 在所有开发人员中，有 **{value}** 的人对其持肯定态度，因此 Vite 再次荣获最受喜爱技术奖！

  ###########################################################################
  # Conclusion
  ###########################################################################

  - key: conclusion.js2024.fernando_herrera
    t: |
      <span class="first-line">几年前，另一项 JS 生态调查让我关注到了 Astro。</span>

      我决定尝试一下，在花了几个小时后，我爱上了这项技术。几乎是一见钟情！突然间，我开始用 Astro 重构我的网站、管理工具和其他项目。现在，我可以说 Astro 是迄今为止我最喜欢的框架。

      JavaScript 是一个充满活力且不断发展的生态系统，拥有众多库和框架。从可复用组件到客户端、服务器端和静态解决方案，使用原生 JavaScript、社区包、库或框架都有无数种方式来实现你的目标，每种方式都为创新提供了新的机会。 当然，这可能会让人感到不知所措，但正是这种多样性让 JavaScript 变得强大，为你提供了从单一到数百种聪明的成功方法。

      不要害怕尝试不同的工具 —— 无论是 Vitest 还是 Jest， React 还是 Solid， Node 还是 Deno， Next.js 还是 Astro， 或者像 [Brisa](https://brisa.build/) 这样完全新的工具。

      保持好奇心，因为没有其他语言能像 JavaScript 一样提供如此丰富的社区、灵活性和创造力 ！

  - key: conclusion.js2024.fernando_herrera.bio
    t: 开发者、教育家和 YouTuber

  - key: conclusion.js2024.shaundai_person
    t: |
      <span class="first-line">就在不到五年前，我第一次发现了使用 TypeScript 的优势。</span>

      我不是唯一一个这样的人；我是众多 JavaScript 开发人员中的一员，他们刚刚开始探索 TypeScript 及其对旨在创建可扩展、可维护的前端系统的团队的益处。 看到 TypeScript 如此迅速地流行起来，我感到非常惊讶！ 我很高兴地看到，大多数调查对象现在都在日常工作中使用 TypeScript。

      如今，我在专业工作和个人项目中常用的技术栈包括 React、TypeScript、Vite 和 Jest。大型团队和快速发展的团队都将赌注押在了这些工具上，并在招聘前端开发人员时寻找这些领域的专业人才。因此，它们被其他组织广泛采用和保留也就不足为奇了。

      如果你像我一样，宁愿专注于掌握一些基本工具，也不愿不断尝试新的框架和库。同样，你可能会像我一样，在可靠的前端工具发布到稳定版本并解决任何问题之前，暂不采用它们的最新版本。你不是一个人，对于我们这些偏爱久经考验的道路的人来说，这样做有很大的好处。

  - key: conclusion.js2024.shaundai_person.bio
    t: 前端高级软件工程师（Netflix）和课程讲师

  ###########################################################################
  # Picks
  ###########################################################################

  - key: picks.my_pick
    t: "我的 2024 选择: "
  - key: picks.intro
    t: 我们询问了 JavaScript 社区的成员，分享他们的“年度选择”

  # https://leaddev.com/personal-development/how-build-trust-new-engineering-manager
  - key: picks.emma_bostian.name
    t: 作为新开发经理如何建立信任
  - key: picks.emma_bostian.bio
    t: 开发经理，讲师，以及 Ladybug Podcast 的联合主持人。
  - key: picks.emma_bostian.description
    t: |
      我发现 LeadDev 上关于新经理技能的博客文章对于作为新工程经理的我来说非常宝贵。它们为任何希望扩展其工程领导和管理技能的人提供了极好的资源！

  # https://pocketbase.io
  - key: picks.fireship.name
    t: Pocketbase
  - key: picks.fireship.bio
    t: Google 开发者专家，数据爱好者，以及 YouTuber
  - key: picks.fireship.description
    t: |
      我的年度选择是 Pocketbase 项目——一个开源的 SQLite 驱动的后端。它的 JavaScript SDK 为 Web 开发者提供了构建一个严肃应用程序所需的一切，而且令人惊讶的是，它可以作为一个单一的二进制文件部署到任何 $5 服务器上。

  # https://www.localfirst.fm/
  - key: picks.rich_harris.name
    t: localfirst.fm
  - key: picks.rich_harris.bio
    t: Vercel 的开源捣蛋鬼。Rollup 和 Svelte 的创建者
  - key: picks.rich_harris.description
    t: |
      如果你对软件的发展方向感兴趣，这个播客是必听的。它会重新点燃你对未来 Web 开发的乐观情绪。

  # https://tldraw.com
  - key: picks.david_khourshid.name
    t: tldraw
  - key: picks.david_khourshid.bio
    t: XState 的创建者和 [http://stately.ai](Stately) 的创始人
  - key: picks.david_khourshid.description
    t: |
      远不止是一个无限画布，tldraw 重新设想了用户界面可能实现的功能，从其令人印象深刻的 AI 实验到对绘图细节的关注。其源代码也是公开的，我欣赏其中的状态机和可扩展的 API，可以进行无尽的调整。

  # https://replicache.dev/
  - key: picks.dax_raad.name
    t: Replicache
  - key: picks.dax_raad.bio
    t: 构建 [SST](https://sst.dev/) 和 [terminal](https://www.terminal.shop/)
  - key: picks.dax_raad.description
    t: |
      没有技术对我多年来交付的质量产生过更大的影响。我认为他们在推动 Web 能做的事情上扛起了火炬。

  # https://lexical.dev/
  - key: picks.german_jablonski.name
    t: Lexical
  - key: picks.german_jablonski.bio
    t: CEO 和 [Fluski](https://fluski.com/) 的创建者，笔记和电子表格管理器
  - key: picks.german_jablonski.description
    t: |
      这是 Meta 文本编辑器非常出色的一年。其巧妙的数据模型和生命周期极大地影响了我的编程方式。

  # https://marvinh.dev/blog/speeding-up-javascript-ecosystem/
  - key: picks.alina_listunova.name
    t: Speeding up the JavaScript ecosystem
  - key: picks.alina_listunova.bio
    t: 前端开发者，技术翻译 🇺🇦
  - key: picks.alina_listunova.description
    t: |
      从 2022 年末开始，Preact 开发者 Marvin Hagemeister 的这一系列持续文章揭示了现代 JavaScript 项目中时间效率低下的元素和方法。对于注重性能的专业人士来说，这确实是一篇引人入胜的文章。

  # https://www.rspack.dev/
  - key: picks.shadowingszy.name
    t: Rspack
  - key: picks.shadowingszy.bio
    t: Datawhale 架构师，字节跳动高级前端研发工程师
  - key: picks.shadowingszy.description
    t: |
      Rspack 是一个基于 Rust 的 Web 打包工具，具有极其出色的性能。通过使用 Rust，它解决了 JS 打包工具中的大量性能瓶颈。并且它可以兼容 webpack 的生态系统。

  # https://unjs.io/
  - key: picks.quarkstuff.name
    t: UnJS
  - key: picks.quarkstuff.bio
    t: Web 和游戏开发极客
  - key: picks.quarkstuff.description
    t: |
      UnJS 生态系统就像一个开发者的玩具箱。从 ofetch 和 consola 到 citty 和 nitro，那里很可能有适合你下一个大项目的东西。

  # https://www.npmjs.com/package/tess2
  - key: picks.martin_heidegger.name
    t: tess2.js
  - key: picks.martin_heidegger.bio
    t: Web 开发者，活动组织者
  - key: picks.martin_heidegger.description
    t: |
      去年我没有做太多 JavaScript 开发，但我对 tess2 算法印象深刻，这是一个 10 年前的 npm 库，至今仍然表现出色！

  # https://auto-animate.formkit.com/
  - key: picks.sacha_greif.name
    t: AutoAnimate
  - key: picks.sacha_greif.bio
    t: State of JS 创始人
  - key: picks.sacha_greif.description
    t: |
      Formkit 的 AutoAnimate 库，你可以在本网站上看到它的实际应用，正如其名，它只需一行代码就能为你的应用添加动画效果！

  # https://nuxt.com/
  - key: picks.rexhent.name
    t: Nuxt
  - key: picks.rexhent.bio
    t: Aspiring Linux and web developer
  - key: picks.rexhent.description
    t: |
      Nuxt 专注于开发体验和用户体验。它稳定且持续改进。它是所有框架中拥有最佳开发者工具的框架，并且创建了 UnJS 和其他工具，这些工具为新的框架如 Nitro 提供了支持。他们是开源社区的支柱。

  # https://medium.com/@devgustavovasquez/the-future-of-web-development-embracing-interoperable-runtimes-bd2006e9b9d7
  - key: picks.gustavo_vasquez.name
    t: Web Interoperable Runtimes
  - key: picks.gustavo_vasquez.bio
    t: Software Engineer 🇧🇷
  - key: picks.gustavo_vasquez.description
    t: |
      Web 互操作运行时是允许代码在多个平台和环境中一致运行的执行环境。我相信，使用这样的标准让我们接触到了 Web 开发的未来。

  # https://x.com/wunderacle
  - key: picks.augustin_mauroy.name
    t: Claudio Wunder
  - key: picks.augustin_mauroy.bio
    t: Web 开发者和开源软件爱好者
  - key: picks.augustin_mauroy.description
    t: |
      Claudio 是一个非常出色的人。他帮助我成长为一名开发者，还凭借他的领导能力，让我有机会重新设计 Node 网站。他继续推动 Node 项目向前发展。

  # https://www.electronjs.org/
  - key: picks.kilian_valkhof.name
    t: Electron
  - key: picks.kilian_valkhof.bio
    t: Polypane Browser for Developers 的创建者
  - key: picks.kilian_valkhof.description
    t: |
      像 VS Code、Figma、Discord、Slack 和 1Password 这样的日常应用都运行在 Electron 上，它仍然是 JS 和开发者生态系统的重要组成部分。许多我们日常使用的工具如果没有 Electron 就不会存在，而且当正确使用时，它确实是一个强大的平台。

  # https://x.com/dawntraoz
  - key: picks.arisa_fukuzaki.name
    t: Alba Silvente Fuentes
  - key: picks.arisa_fukuzaki.bio
    t: Senior DevRel Engineer & Docs at Storyblok
  - key: picks.arisa_fukuzaki.description
    t: |
      Alba 撰写关于前端开发、Web 架构和 Web 性能的文章，曾在许多会议上发表演讲，并拥有一个名为 "No me da la vida" 的播客。她激励了许多开发者，而我也是其中之一！

  # - key: picks.xxxx.name
  #   t:
  # - key: picks.xxxx.bio
  #   t:
  # - key: picks.xxxx.description
  #   t: |
  ###########################################################################
  # Sponsors
  ###########################################################################

  - key: sponsors.frontendmasters.description
    t: 通过深入的现代前端工程课程提升您的技能。
  - key: sponsors.google_chrome.description
    t: 感谢 Google Chrome 团队对我们工作的支持。
  - key: sponsors.tokyodev.description
    t: 今天找到您在日本梦想的开发者工作。
  - key: sponsors.renderatl.description
    t: 专注于 Web 技术的科技会议。

  ###########################################################################
  # FAQ/About
  ###########################################################################

  - key: about.content
    t: |
      2024 年 JavaScript 现状调查从 2024 年 11 月 22 日持续到 12 月 12 日，共收集了 23,540 份回复。结果于 2024 年 6 月 20 日发布。该调查由 [Devographics](https://devographics.com/) 组织，这是一个由我（[Sacha Greif](https://sachagreif.com/)）和 [Eric Burel](https://www.lbke.fr/) 以及受邀专家和开源贡献者组成的集体。

      JavaScript 现状的标志和 T 恤由 [Christopher Kirk-Nielsen](http://chriskirknielsen.com/) 设计。

      ### 调查目标

      本调查旨在识别 Web 开发生态系统中的新兴趋势，以帮助开发者做出技术选择。

      因此，调查侧重于预测未来几年即将到来的趋势，而不是分析当前流行的内容，这就是为什么某些功能或技术有时会被忽略，即使它们目前非常普遍。

      此外，调查结果应被视为**特定开发者群体的快照**，并不代表整个生态系统。

      ### 调查设计

      该调查部分基于去年的调查设计，并在 [GitHub](https://github.com/Devographics/surveys/issues?q=is%3Aissue+is%3Aopen+label%3A%22State+of+JS+2024%22) 上进行了开放反馈期，讨论了调查大纲。

      所有调查问题都是可选的。

      ### 调查受众

      该调查在网上公开访问，受访者没有经过任何过滤或选择。受访者主要是过去调查的受访者（通过专门的邮件列表提醒）和社交媒体流量的混合体。

      请注意，框架、库等可以鼓励他们的受众参与调查，其中一些确实通过横幅、推文等方式利用了这一点。详细的流量来源细分包含在“来源”图表中。

      ### 项目资金

      该项目资金来自多种来源：

      - **T 恤销售**。

      - **赞助链接**：每个页面底部的推荐资源链接由我们的合作伙伴 [Frontend Masters](https://frontendmasters.com/) 和 [RenderATL](https://www.renderatl.com/) 提供。

      - **直接资助**：今年，[Google](https://www.google.com/) 资助了我在调查方面的工作。

      任何贡献或赞助都非常感谢。我们特别希望与更多的浏览器供应商密切合作，因为他们在 Web 生态系统中扮演着如此核心的角色。

      ### 技术概述

      您可以在 [这里](https://dev.to/sachagreif/how-the-devographics-surveys-are-run-2024-edition-1p6a) 找到关于如何运行调查的更深入技术概述。

  ###########################################################################
  # Takeaways
  ###########################################################################

  # user_info

  - key: user_info.country.takeaway.js2024
    t: >
      和往常一样，美国在受访者中占了很大一部分，在收入中位数方面也名列前茅。

  - key: user_info.age.takeaway.js2024
    t: >
      JS 状态受访者的平均年龄为 33.5 岁，结果比 CSS 状态（34.9）和 HTML 状态（35.8）略年轻。

      不出所料，年龄和收入呈正相关；在年轻年龄组中看到更多的性别多样性是令人鼓舞的，因为这可能表明人口统计学的变化。

      有趣的是，年轻的受访者更有可能患有认知障碍和视力障碍，而年长的受访者则更多地受到听力和行动障碍的影响。

  - key: user_info.years_of_experience.takeaway.js2024
    t: >
      51% 的受访者拥有 10 年或更短的工作经验 —— 这意味着大多数调查者还不了解现代 JavaScript 框架之前的世界。

      与年龄类似，经验较少的组别也显示出更多的性别多样性

  - key: user_info.company_size.takeaway.js2024
    t: >
      规模较大的公司在受访者中仍占相当大的比例，而公司规模仍与收入水平相关。

  - key: user_info.yearly_salary.takeaway.js2024
    t: >
      虽然我们经常听到硅谷有六位数薪水的故事，但实际上，全世界大多数前端开发人员的收入要低得多，这一点在直接比较美国和世界其他地区时就会很明显。

  - key: user_info.job_title.takeaway.js2024
    t: >
      在 JavaScript 生态系统中，不同的职位名称似乎与前端框架一样多。但一个明显的趋势是，任何带有 “工程师 ”字样的职位都能为你带来更多收入 —— 即使与首席执行官、首席技术官和创始人相比也是如此。另一方面，“开发人员 ”显然处于阶梯的最底层，也许可以考虑印制新的名片......


      在人口统计学方面，全栈和前端职位的员工平均年龄最小，前端职位的女性比例也明显较高。

  - key: user_info.higher_education_degree.takeaway.js2024
    t: >
      虽然拥有学位能确保你赚得更多，但事实证明，学位并不一定与编程有关。

  - key: user_info.gender.takeaway.js2024
    t: >
      与 2023 年相比，我们看到女性和非二元受访者的比例略有增加，部分原因是今年[重新开展了外联工作](https://dev.to/sachagreif/state-of-js-2024-outreach-and-diversity-report-n0e)。

  - key: user_info.race_ethnicity.takeaway.js2024
    t: >
      非白人受访者更有可能更年轻、经验更少，这可以解释为什么他们的收入也更低；希望这也表明该行业的年轻群体正在不断多样化。

  - key: user_info.disability_status.takeaway.js2024
    t: >
      无论是永久性还是暂时性残疾，对我们中的许多人来说都是日常生活的一部分，尤其是随着年龄的增长，听力和行动不便的情况会更加严重。

      许多患有视力和认知障碍的受访者相对年轻，这也可以解释为什么这些残疾与收入水平相关。

  # features

  - key: features.language_pain_points.takeaway.js2024
    t: >
      当被问及他们最头疼 JavaScript 的哪一方面时，绝大多数受访者都提到了缺乏内置类型系统，浏览器支持问题则排在第二位。

  - key: features.browser_apis_pain_points.takeaway.js2024
    t: >
      不出所料，浏览器支持不力是浏览器及其 API 方面的最大障碍。Safari 也被强调为一个共同的痛点，浏览器功能文档的整体缺乏也是如此。

  - key: features.reading_list.takeaway.js2024
    t: >
      阅读列表可让您保存调查完成后想了解的项目。

      今年，`error.cause`、逻辑赋值和 `Object.groupBy()` 是最能引发受访者好奇心的功能。

  # tools

  - key: tools.all_tools_experience.takeaway.js2024
    t: >
      Webpack 是使用最多的 JavaScript 工具，但不是最受喜爱的。这一头衔属于 Vite，它获得了 56% 的好评（注意，今年也有保持中立的选项）。令人吃惊的是，尽管 Vite 推出的时间相对较短，但它也是使用率第三高的工具！


      另一方面，React 不仅在最常用排行榜上名列第二，而且在最受喜爱排行榜上也名列第二 —— 这对于一个已经有 10 多年历史的项目来说是相当不容易的！同样值得注意的是，React 的用户主动选择情感的比例也是最高的。

  - key: tools.tools_arrows.takeaway.js2024
    t: >
      随着时间的推移，JavaScript 库通常会出现 “回旋镖 ”模式：由于早期的积极推动（直线向右），使用率会增加（直线向上），但用户随后会遇到更多的边缘情况和实际问题，意见会变得更加消极（直线向左）。


      因此，看到那些能够逆势而上的项目总是很有意思，比如 Vue 和 Angular，它们都在经历了几年的不景气之后再次获得了积极的评价。

  - key: tools.tier_list.takeaway.js2024
    t: >
      遗憾的是，目前还没有单一的 “S 级 ”技术栈，但 SvelteKit 和 Astro 似乎都是启动项目的安全选择，可能还需要使用 Vitest 进行测试，并使用 pnpm 管理你的 monorepo。

  - key: tools.scatterplot_overview.takeaway.js2024
    t: >
      值得注意的是，只有三个库的受访者使用率超过 50%，而留存率却大于 50%： React、Jest 和 Vite 是生态系统相对分散的标志。

  # front end frameworks

  - key: tools.front_end_frameworks_ratios.takeaway.js2024
    t: >
      去年的大事件是 Vue 在受访者中的原始使用率超过了 Angular。尽管 Angular 在今年取得了进步，但 Vue 还是保住了第二的位置，而且在留存率方面也获得了三位之多！

      与此同时，Svelte 的使用率也在稳步上升，在总体正面评价方面继续名列前茅。

  - key: tools.front_end_frameworks_pain_points.takeaway.js2024
    t: >
      作为现任者，React 不得不成为承担多数抱怨的目标。


      过于复杂、选择过多、性能不佳和破坏性更改也是常见的主要痛点。

  - key: tools.front_end_frameworks_work.takeaway.js2024
    t: >
      虽然受访者在工作中使用哪种前端框架并没有造成收入上的实质性差异，但公司规模却说明了不同的问题。


      新的挑战者 Alpine.js、Qwik 和 Solid 正受到小公司的青睐，而 Web Components解决方案 Lit 和 Stencil 则被大公司广泛使用。

  # meta frameworks

  - key: tools.meta_frameworks_ratios.takeaway.js2024
    t: >
      就原始使用率而言，Next.js 仍遥遥领先于竞争对手。然而，如果不看 Gatsby，Next.js 的留存率将会是倒数第一。


      这说明 Astro 和 SvelteKit 取得了成功，尤其是到目前为止，它们已经成功地让用户感到非常满意。

  - key: tools.meta_frameworks_pain_points.takeaway.js2024
    t: >
      就像 React 本身的类别一样，Next.js 作为领导者也首当其冲地受到了批评。

  - key: tools.meta_frameworks_work.takeaway.js2024
    t: >
      Gatsby 可能是最不受欢迎的工具之一，但却是最赚钱的工具 —— 这很可能是因为它主要被用于大公司。


      另一方面，Astro 仍处于企业应用的起步阶段，而企业应用又与较低的收入相关。

  # testing

  - key: tools.testing_ratios.takeaway.js2024
    t: >
      在过去几年中，Vitest 的排名上升趋势如此明显，实属罕见。虽然在使用率方面，它可能 “仅 ”排名第四，但在兴趣、留存率和整体积极性方面，它已经高居榜首，而且没有任何迹象表明它很快就会让出第一的位置。

  - key: tools.testing_pain_points.takeaway.js2024
    t: >
      Mocking 是测试带来的最大痛点，其次是复杂设置和配置带来的麻烦，以及测试运行缓慢带来的负担。

  - key: tools.testing_work.takeaway.js2024
    t: >
      Vitest 显示了技术生命周期初期的典型迹象：留存率高、兴趣浓厚，但目前在大公司中的采用率较低。

  # mobile desktop
  - key: tools.mobile_desktop_ratios.takeaway.js2024
    t: >
      在过去的十年中，开发移动和桌面应用程序变得越来越普遍，但这并不意味着开发人员一定会对他们的工具感到满意。


      虽然 Tauri 和 Expo 在留存率排行榜上名列前茅，但与优秀的本地应用程序相比，其他所有应用程序的留存率都较低。

  - key: tools.mobile_desktop_pain_points.takeaway.js2024
    t: >
      JavaScript 代码库在性能方面仍难以与纯粹的原生应用程序相抗衡。Electron 和 React Native 似乎都有各自的缺点。

  - key: tools.mobile_desktop_work.takeaway.js2024
    t: >
      同样，像 Tauri 这样的新工具在工作场所似乎主要被经验较少的开发人员所使用，这也说明没有那些包袱有时也是件好事！

  # build tools

  - key: tools.build_tools_ratios.takeaway.js2024
    t: >
      与同门兄弟 Vitest 一样，Vite 也在以创纪录的速度扩大市场份额。此外，请务必关注新进入市场的 Rolldown 和 Rspack，它们在排行榜上的起点都很高。

  - key: tools.build_tools_pain_points.takeaway.js2024
    t: >
      配置过多历来是构建工具的弊病，但往往也正是这种复杂性造就了这些工具的强大功能。

  - key: tools.build_tools_work.takeaway.js2024
    t: >
      Rspack 以某种方式逆势而上，一跃成为大公司的采用对象，这无疑是它采取了非常聪明的策略，成为 webpack 的直接替代品。

  # monorepo tools

  - key: tools.monorepo_tools_ratios.takeaway.js2024
    t: >
      Monorepos 尚未成为网络开发生态系统的主流，但对于那些勇于探索这一新领域的人来说，pnpm 似乎是当之无愧的领跑者。

  - key: tools.monorepo_tools_ratios.takeaway.js2024
    t: >
      Monorepos 仍然很难正确设置。而软件包管理本身，我们也还没有完全搞清楚......不过话说回来，谁又搞清楚了呢？

  - key: tools.monorepo_tools_work.takeaway.js2024
    t: >
      由于公司规模通常与代码库规模相关联，因此许多 monorepo 工具被大公司使用也就不足为奇了。

  # usage

  - key: usage.js_ts_balance.takeaway.js2024
    t: >
      我们现在已经进入了 TypeScript 时代。67%的受访者表示，他们编写的 TypeScript 代码多于 JavaScript 代码，而最大的一个群体是**只**编写 TypeScript 的人。

  - key: usage.compiled_code_balance.takeaway.js2024
    t: >
      2024 年，我们几乎所有的 JavaScript 代码都要经过构建步骤，这一点不足为奇。捆绑程序和构建工具无疑会增加开发过程的复杂性，但它们很可能会继续存在。

  - key: usage.ai_generated_code_balance.takeaway.js2024
    t: >
      尽管人们都在谈论 AI 辅助编码，但我们中的大多数人仍然只是很少使用 AI 工具。事实上，有整整 20% 的人根本不使用这些工具来编写代码。

  - key: usage.usage_type.takeaway.js2024
    t: >
      了解受访者在什么情况下编写 JavaScript 代码总是有好处的，绝大多数受访者在日常工作中使用 JavaScript。

  - key: usage.what_do_you_use_js_for.takeaway.js2024
    t: >
      几乎所有受访者都表示，他们使用 JavaScript 进行前端开发，这与该语言的起源不无关系。

  - key: usage.industry_sector.takeaway.js2024
    t: >
      虽然最大的行业部门是为其他开发人员开发工具的开发人员，但收入最高的行业部门却是广告业。

  - key: usage.js_app_patterns.takeaway.js2024
    t: >
      尽管现代 JavaScript 元框架现在支持复杂的呈现策略，但最常见的应用模式仍然是最传统的模式：单页面应用和服务器端呈现。

  - key: usage.top_js_pain_points.takeaway.js2024
    t: >
      一旦代码库超过一定规模，代码架构就会成为一个令人担忧的问题，因此它在 JavaScript 总体痛点排名中名列前茅也就在情理之中了，其次是状态和依赖性管理。

  - key: usage.js_new_features.takeaway.js2024
    t: >
      目前有不少 [TC39 提案](https://github.com/tc39/proposals) 即将成为现实。今年，受访者最感兴趣的是 “时态 ”和 “装饰器”。

  - key: usage.top_currently_missing_from_js.takeaway.js2024
    t: >
      虽然社区长期以来一直觉得缺乏原生静态类型，但有趣的是，尽管 Signals 并不是最流行的前端框架的一部分，它却在这份榜单中排名第三。

  - key: usage.native_types_proposal.takeaway.js2024
    t: >
      很明显，调查对象想要原生类型，而且他们希望能用类似于 TypeScript 的语法来实现这些类型。


      遗憾的是，今年的问题措辞没有明确区分运行时类型和类似于 TypeScript 的类型即注释，因此这两条路线中哪条会获得社区的青睐还有待观察。

  # resources

  - key: resources.courses.takeaway.js2024
    t: >
      Udemy has done a great job of drafting popular instructors such as Brad Traversy or Colt Steele to boost its roster of JavaScript courses, and so has Frontend Masters (disclaimer: Frontend Masters financially supports this survey).


      It's also worth mentioning You Don't Know JS, a great book available online for free.

  - key: resources.newsletters.takeaway.js2024
    t: >
      Newsletters are a great way to stay up to date with the ever-changing JavaScript landscape, and Cooperpress' JavaScript Weekly continues to lead the field.

  - key: resources.podcasts.takeaway.js2024
    t: >
      While Syntax retains its crown for now, a new challenge might come in the form of video creators such as The Primeagen and Midudev, who can easily generate audio content in addition to traditional streams.

  - key: resources.video_creators.takeaway.js2024
    t: >
      Fireship, Theo, The Primeagen, stand atop the video creator rankings. But it's worth highlighting how vibrant the Spanish-language ecosystem has become, starting with (but not limited to!) Midudev in fourth place overall.


      Note that the second tab shows the same rankings, but manually filtered down to Spanish-language creators only.

  - key: resources.people.takeaway.js2024
    t: >
      English has long been the dominant language of the tech industry, but in our corner of the world at least Spanish is stepping up to the challenge, with Midudev and Fernando Herrera topping the rankings of most influential developers for non-video channels.

  # metadata

  - key: user_metadata.source.takeaway.js2024
    t: >
      大多数受访者在前几年就知道这项调查。还值得一提的是，[Angular](https://angular.dev/) 和 [Nuxt](https://nuxt.com/) 主页上都展示了横幅，引导用户参与调查；尽管这是 Bluesky 首次作为调查的流量来源出现，但它排在第 5 位。


      我们还进行了特别的外联工作（[完整报告在此处](https://dev.to/sachagreif/state-of-js-2024-outreach-and-diversity-report-n0e)），重点是吸引更多女性开发者。

  - key: user_metadata.past_surveys.takeaway.js2024
    t: >
      此图表显示了今年的受访者之前参加过哪些其他 Devographics 调查。


      今年的受访者中有相当一部分还参加过其他调查，这一事实表明，Web 开发并不像人们想象的那么分散——即使你主要编写 JavaScript，跟上 CSS 和 Web 平台仍然是关键！


      请注意，我们只能为登录后参加调查的受访者生成此数据点。访客受访者显示为“无答案”。

  - key: user_metadata.past_same_survey_count.takeaway.js2024
    t: >
      此图表显示了今年的受访者之前参加过多少次 JS 状态调查。


      最大的群体由新受访者组成，这意味着我们成功地接触到了新的人群，这减轻了可能从我们现有受众中延续下来的偏见。但它也指出了让人们年复一年地持续填写调查问卷的挑战。


      请注意，我们只能为登录后参加调查的受访者生成此数据。访客受访者显示为“无答案”。