跳到内容

组件库

构建前端应用的砖块

组件库随时间变化的比重

虽然 MUI 在使用率方面一直排名第一,但 shadcn/ui 的使用率却大幅提升,一年内从 20% 翻番至 42%,并以 80% 的积极性高居榜首!

Ant Design
Chakra UI
Headless UI
MUI
Radix
React Bootstrap
shadcn/ui
React Aria
Mantine

模式:

视图:

使用度:

使用过某个项目的受访者比例
0%
20%
40%
60%
80%
100%
2023
2024
0%
20%
40%
60%
80%
100%

Number of Items

How many items in this category respondents have used.

0%
6%
11%
17%
23%
28%
1

0

2,232
2

1

1,315
3

2

1,366
4

3

1,125
5

4

804
6

5

498
7

6

280
8

7

130
9

8

78
10

9

42
0%
6%
11%
17%
23%
28%
调查对象百分比
💡
你可以单击任何技术的名称, 来获得额外的详细信息,并更深入地查看其相关数据。

Other Component Libraries

What other component libraries have you used?
(自由提问)
Multiple
0%
20%
40%
60%
80%
100%
1

2

3

4

5

6

7

8

9

10

0%
20%
40%
60%
80%
100%
受访者百分比
我们邀请 React 社区成员分享他们的"年度之选"

我的 2024 年度之选: nuqs: React 的类型安全搜索参数状态管理器

我的选择是 François Best 和他的库 nuqs。除了 Next.js 之外,最近还为其他 React 框架提供了支持,它在处理URL查询参数时解决了许多痛点,API 非常流畅且易于使用。
我们邀请 React 社区成员分享他们的"年度之选"

Aurora Scharff

Inmeta 的 Web 开发者和顾问

Motion(前身为 Framer Motion)当之无愧地获得第一名,以庆祝其最近的品牌重塑!

你用过哪些动画库?
Multiple
0%
20%
40%
60%
80%
100%
1

2,883
2

1,488
3

1,022
4

927
5

844
6

287
7

8

9

10

1,880
11

其他答案

97
0%
20%
40%
60%
80%
100%
受访者百分比

数据可视化

今年,Chart.js 位居榜首。顺便提一下,你知道这项调查的所有图表都是定制的吗?

您使用过哪些数据可视化和图形库?
Multiple
0%
20%
40%
60%
80%
100%
1

2,978
2

2,338
3

1,888
4

1,149
5

375
6

302
7

241
8

234
9

194
10

0%
20%
40%
60%
80%
100%
受访者百分比

目前,React Hook Form 是最常见的表单库。但随着 TanStack 的日益流行,未来对 TanStack Forms 的关注将非常有趣。

你用过哪些库来管理表单?
Multiple
0%
20%
40%
60%
80%
100%
1

4,275
2

2,795
3

670
4

449
5

281
6

154
7

8

33
9

10

11

12

961
13

其他答案

114
0%
20%
40%
60%
80%
100%
受访者百分比

有趣的是,大多数开发人员都能自如地使用 controlleduncontrolled 两种形式。

尽管如此,如果你必须只选择一种,那么 controlled 表单输入似乎是个不错的选择!

您通常喜欢使用哪种表单范式?
0%
20%
40%
60%
80%
100%
1

都用,看具体场景

3,103
2

Controlled 表单组件

2,335
3

Uncontrolled 表单组件

606
4

其他答案

16
0%
20%
40%
60%
80%
100%
受访者百分比

Tailwind 干掉了 CSS-in-JS 吗?还是 CSS 本身迎头赶上了?无论如何,CSS 架构花哨的时代似乎已经过去了,因为前三名都被历史悠久的 CSS 工具占据了。

您使用哪些库或框架来设置 React 应用的样式?
Multiple
0%
20%
40%
60%
80%
100%
1

4,587
2

3,991
3

3,772
4

3,715
5

1,973
6

1,198
7

372
8

220
9

219
10

182
0%
20%
40%
60%
80%
100%
受访者百分比

Component Pain Points

What pain points have you encountered related to working with components?
(自由提问)
Multiple
0%
20%
40%
60%
80%
100%
1

Styling & customization

2

Form issues

3

Tailwind issues

4

CSS-in-JS

5

MUI issues

6

Performance

7

Excessive complexity

8

Styled Components issues

9

其他答案

匹配“其他答案”的答案 278
0%
20%
40%
60%
80%
100%
受访者百分比
Tailwind CSS
Steve Kinney
Temporal

Tailwind CSS

By the end of this course, you'll be proficient in building visually stunning, responsive, and maintainable user interfaces with Tailwind CSS!
Design Systems with Storybook, v2
Steve Kinney
Temporal

Design Systems with Storybook, v2

Create reusable UI components with composable styles and variants using Tailwind CSS. Use MDX for documentation, set up interaction testing, and add data fetching to create a robust dev environment for your component library.
感谢合作伙伴对我们的支持! 了解更多。