Перейти до вмісту

State of React 2023

Бібліотеки компонентів

Елементи для побудови вашого застосунку

Досвід використання і ставлення до бібліотек компонентів

React Aria і Radix — найперші у рейтингу за позитивним ставленням, доводячи, що створення бібліотек доступних, легких компонентів без стилів (headless approach) має багато переваг.

Групувати за:

Сортувати за:

1

57.5%
31.1%
11.4%
10,034
2

32.3%
53.2%
14.5%
10,009
3

27.9%
48.9%
23.2%
10,045
4

25.3%
35.5%
39.2%
10,002
5

22.2%
59.6%
18.2%
10,034
6

22.1%
45.7%
32.3%
10,013
7

20.8%
29.9%
49.3%
10,012
8

10.6%
37.9%
51.5%
9,760

Досвід

  • Використовував(-ла): Респонденти, які це використовували.
  • Чув(-ла) про це: Респонденти, які чули про це, але не використовували.
  • Вперше чую: Респонденти, які не чули про це.

Ставлення

  • Позитивно: Респонденти, які зацікавлені у вивченні технології або хочуть використовувати її ще.
  • Нейтрально: Респонденти, які не висловили жодного ставлення до технології.
  • Негативно: Респонденти, які не зацікавлені у вивченні технології або використовували її і мали негативний досвід.
“Used” average:27%
“Positive” average:22%
“Negative” average:22%
💡
Ви можете натиснути на назву будь-якої технології, щоб отримати більше деталей та вичерпніший погляд на відповідні дані.

Інші бібліотеки компонентів

0%
12%
24%
35%
47%
59%
1

406
2

153
3

125
4

99
5

71
6

59
7

49
8

48
9

47
10

41
11

Інші відповіді

808
0%
12%
24%
35%
47%
59%
% від тих, хто відповів на питання
1,360
10%
Які ще бібліотеки компонентів ви використовували?
Ми покликали спільноту React поділитися своїм "вибором року"

Мій вибір 2023: "Mind the Gap" – виступ Ryan Florence на Big Sky Dev Con 2024

Ryan майстерно показує, як нові директиви React "use server" і "use client" дають змогу створювати різноманітну функціональність з обох боків мережі, використовуючи єдину парадигму. Обов'язковий для перегляду розробникам React.
Ми покликали спільноту React поділитися своїм "вибором року"

Sam Selikoff

Роблю відео для розробників клієнтської частини на платформах Build UI та YouTube, співведучий подкасту "Frontend First"

Анімації

0%
8%
17%
25%
33%
41%
1

3,802
2

2,500
3

1,386
4

1,044
5

464
6

7

8

9

10

0%
8%
17%
25%
33%
41%
% від тих, хто відповів на питання
9,175
71%
Які бібліотеки ви використовували для роботи з анімаціями?

Візуалізація даних

0%
9%
18%
27%
36%
45%
1

3,858
2

2,490
3

634
4

536
5

436
6

368
7

8

284
9

10

0%
9%
18%
27%
36%
45%
% від тих, хто відповів на питання
8,659
67%
Які бібліотеки ви використовували для візуалізації даних та роботи з графікою?

Бібліотеки для форм

0%
13%
26%
39%
52%
65%
1

6,078
2

4,617
3

254
4

5

6

7

60
8

9

10

0%
13%
26%
39%
52%
65%
% від тих, хто відповів на питання
9,290
71%
Які бібліотеки ви використовували для роботи з формами?

Інструменти та бібліотеки CSS

0%
13%
27%
40%
53%
67%
1

6,597
2

6,587
3

6,572
4

6,427
5

3,453
6

2,165
7

618
8

477
9

319
10

0%
13%
27%
40%
53%
67%
% від тих, хто відповів на питання
9,886
76%
Які бібліотеки або фреймворки ви використовували для стилізації ваших React-застосунків?

Проблеми у роботі з компонентами

0%
15%
29%
44%
59%
73%
1

Styling & customization

2

Tailwind issues

3

CSS-in-JS

4

MUI issues

5

form_issues

6

Excessive complexity

7

Performance

8

Styled Components issues

9

10

Lack of documentation

0%
15%
29%
44%
59%
73%
% від тих, хто відповів на питання
450
3%
З якими проблемами ви стикалися під час роботи з компонентами?
Довільна форма

Рекомендовані джерела

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.
Дякуємо нашим партнерам за підтримку! Детальніше.