-
Notifications
You must be signed in to change notification settings - Fork 5
/
js2024.yml
701 lines (482 loc) · 60.2 KB
/
js2024.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
locale: ua-UA
translations:
###########################################################################
# General
###########################################################################
- key: general.results.description
t: Щорічне опитування про останні тенденції в екосистемі JavaScript за 2024 рік.
###########################################################################
# Survey Intro
###########################################################################
# JS 2024
- key: general.js2024.survey_intro
t: >
Поки ми заклопотано намагались визначити, на яку клієнтську бібліотеку покластися далі, JavaScript переживав власну еволюцію.
Нові пропозиції TC39 збурюють спільноту, тоді як інші вже знаходяться за крок від повсюдного впровадження в браузерах. А через популярність TypeScript перспектива підтримання нативних типів колись у майбутньому видається досить-таки здійсненною.
Певність лише в одному: хоч JavaScript 2024 року все ще здається знайомим, немає гарантії, що ми зможемо сказати те саме про мову, якою писатимемо через п'ять років.
Однак до того часу ви можете допомогти окреслити шлях, пройшовши цьогорічне опитування про стан 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) із залученням постачальників браузерів і спільноти веброзробки.
- key: faq.results_released_js2024
t: Коли будуть опубліковані результати?
- key: faq.results_released_js2024.description
t: Опитування триватиме із 13 листопада до 10 грудня 2024 року, і його результати будуть опубліковані незабаром після завершення.
###########################################################################
# 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: Футболка
- key: sections.tshirt.description
t: |
## Підтримайте опитування за допомогою футболки "Стан JS"
Погана якість відео, громіздкі касети та необхідність перемотування назад — здається, ніхто не сумує за чимось з епохи VHS. Але нам *все-таки* не вистачає одного — дивовижних зображень 90-х, які раніше прикрашали порожні VHS-касети.
І тепер завдяки талановитому Christopher Kirk-Nielsen ви можете насолоджуватися добірним ретро, водночас відзначаючи свою любов до JavaScript!
- key: tshirt.about
t: Про футболку
- key: tshirt.description
t: |
Ми використовуємо високоякісну, надм'яку футболку приталеного крою із тканини з трьох типів волокна (tri-blend), надруковану нашими партнерами з Cotton Bureau.
- key: tshirt.getit
t: Отримати
- key: tshirt.price
t: USD $32 + доставляння
- key: tshirt.designer.heading
t: Про дизайнера
- key: tshirt.designer.name
t: Christopher Kirk-Nielsen
- key: tshirt.designer.bio
t: |
Chris родом із Франції, але тепер проживає у Сполучених Штатах; він не лише чудовий розробник клієнтської частини, а й талановитий ілюстратор, який спеціалізується на зображеннях у стилі ретро. Ми радимо вам переглянути [інші дизайни його футболок](https://chriskirknielsen.com/designs)!
###########################################################################
# Sections
###########################################################################
- key: sections.user_info.description.js2024
t: |
Цього року в опитуванні взяли участь **14015** респондентів.
Вперше цього року, окрім звичайних демографічних даних, ми також запитали про назви посад — і дійшли до цікавих висновків про те, як ці назви співвідносяться з доходом, віком і статтю.
- key: sections.features.description.js2024
t: |
Хоч вони ще не мають широкого використання, нові функції JavaScript для Set і Object зменшать необхідність покладатися на сторонні бібліотеки утиліт.
Також, за можливості, ми тепер відображаємо [базову лінію](https://webdoky.org/uk/docs/Glossary/Baseline/Compatibility/) кожної функції: зелену для "широкодоступного", синю для "доступного віднедавна" та білу для "доступного обмежено".
- key: sections.libraries.description.js2024
t: |
Хоч екосистема JavaScript все ще досить фрагментована, приємно бачити, що окремі бібліотеки, які найчастіше використовуються, також найбільше й цінуються.
Обов'язково вивчіть наші нові параметри групування та сортування, щоб з'ясувати, які бібліотеки приваблюють найбільше… або найменше!
- key: sections.other_tools.description.js2024
t: |
Цього року в опитуванні дебютують ШІ-інструменти, і вражає чисельність наявних опцій, незважаючи на поточне домінування кількома лідерами!
- 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: >
Ця діаграма зібрана із джерел переходу (referrers), параметрів URL та відповідей довільної форми.
- Стан JS: список розсилання електронною поштою про ["Стан JS"](https://stateofjs.com).
- Стан CSS: список розсилання електронною поштою про ["Стан CSS"]; тексти з відповідниками `email`, `by email` тощо.
- Робота: тексти з відповідниками `work`, `colleagues`, `coworkers` тощо.
###########################################################################
# Awards
###########################################################################
# - key: award.feature_adoption_delta_award.comment
# t: Із прогресом **{value}** у 2022 році **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: Метафреймворк **Analog** для Angular став найбільш згадуваною технологією у вписуваному тексті (write-ins); кількість згадувань — **{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 є безсумнівно моїм улюбленим фреймворком.
JavaScript — це динамічна та захоплива екосистема, що розростається численними бібліотеками і фреймворками день у день. Від використовуваних повторно компонентів до клієнтських, серверних і статичних рішень — є незліченна кількість способів досягти ваших цілей за допомогою стандартного JavaScript, пакетів спільноти, бібліотек або фреймворків, кожен з яких пропонує нові можливості для інновацій. Звісно, це здається надмірним, але ця різноманітність власне употужнює JavaScript, надаючи вам від одного до сотень узасаднених шляхів до успіху.
Не бійтеся занурюватися та експериментувати з різними інструментами: Vitest чи Jest, React чи Solid, Node чи Deno, Next.js чи Astro, чи щось геть нове, як-от [Brisa](https://brisa.build/).
І не втрачайте зацікавленості, оскільки жодна інша мова не пропонує такі спільноту, гнучкість та креативність, як JavaScript!
- key: conclusion.js2024.fernando_herrera.bio
t: Розробник, освітній діяч і YouTube-відеоблогер
- 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 поділитися своїм "вибором року"
- key: picks.jack_herrington.name
t: TanStack
- key: picks.jack_herrington.bio
t: Програміст та YouTube-відеоблогер
- key: picks.jack_herrington.description
t: |
Tanstack, бенкет із практичних, високоякісних, перевірених у боях бібліотек, кульмінацією яких став фреймворк TanStack Start.
- key: picks.josefine_schaefer.name
t: Arisa Fukuzaki
- key: picks.josefine_schaefer.bio
t: Інженерка з доступності
- key: picks.josefine_schaefer.description
t: |
Arisa — прекрасна технічна викладачка, наставниця, інженерка у сфері DevRels та ведення документації, що захоплено займається JavaScript-фреймворками, роботою зі спільнотою та підтримкою жінок у технологічній індустрії. Вона варта вашої уваги!
- key: picks.cassie_evans.name
t: gsap-video-export
- key: picks.cassie_evans.bio
t: Робить всього потрохи в GSAP
- key: picks.cassie_evans.description
t: |
Chris створив цей надзвичайно зручний інструмент для експорту вашої GSAP-анімації у відео. Це значно спростило моє життя та зробило плавнішими мої відео — більше жодних записів з екрана низької якості!
- key: picks.tania_rascia.name
t: Cassidy Williams
- key: picks.tania_rascia.bio
t: Самонавчена головна інженерка, досвідчена технічна блогерка і професійно підготовлена шеф-кухарка
- key: picks.tania_rascia.description
t: |
Cassidy пише у своєму блозі із 2009 року, має неймовірно унікальний стиль і численні круті, нішеві інтереси (я горда володарка її клавіатури для копіювання/вставлення із StackOverflow!). Вона щотижня публікує доладну розсилку, створює найкращі меми для розробників і робить усе це у ролі молодої мами, що, безумовно, вражає.
- key: picks.salma_alam_naylor.name
t: The Breedling
- key: picks.salma_alam_naylor.bio
t: Стримерка наживо, інженерка програмного забезпечення і просвітниця для розробників
- key: picks.salma_alam_naylor.description
t: |
Вебтехнології призначені не лише для простих вебсайтів. Breedling — це інструмент візуалізації у браузері, який супроводжує концерти живої музики однойменного гурту, поєднуючи відео та RIVE-анімацію шейдерами WebGL та використовуючи стару експериментальну бібліотеку VideoContext від BBC.
# - key: picks.wes_bos.name
# t: Transformers.js
# - key: picks.wes_bos.bio
# t: Автор подкастів та освітній діяч
# - key: picks.wes_bos.description
# t: |
# Transformers.js — це бібліотека для роботи над моделями ШІ в JavaScript. Він робить усе: комп'ютерне бачення, аудіо, створення зображень, створення чат-бота тощо.
# Він працює в браузері, через WASM або WebGPU, а також на сервері з Node.js, Bun або Deno. Запуск моделей штучного інтелекту на пристрої досить захопливий, і ця бібліотека є чудовим способом почати роботу без будь-якого болю, пов'язаного зі спробами запустити Python.
- key: picks.shaundai_person.name
t: Shruti Kapoor
- key: picks.shaundai_person.bio
t: Інженерка клієнтського програмного забезпечення (Netflix) та інструкторка курсів
- key: picks.shaundai_person.description
t: |
Мій вибір року – моя подруга Shruti Kapoor. Shruti може пояснити найзаплутаніші технічні концепції JS надзвичайно зрозуміло. У своїх веселих і захопливих YouTube-відео і виступах на конференціях вона навчає свою аудиторію ключовим частинам JavaScript-розробки без зайвої води.
# - key: picks.michelle_bakels.name
# t: v0
# - key: picks.michelle_bakels.bio
# t: Розробниця програмного забезпечення, розбудовниця спільноти й організаторка "React Miami" з G2i
# - key: picks.michelle_bakels.description
# t: |
# Хоча ШІ-компаньйони для програмування будуть і надалі, вони все одно можуть зіткнутися з проблемами, не відстаючи від останніх розробок у нашій екосистемі. v0 — це не тільки найкращий інструмент для створення UI, але він також має найсильніший контекст для надання цінної та відповідної допомоги у написанні коді з огляду на поточний стан JavaScript.
- key: picks.sacha_greif.name
t: Bluesky
- key: picks.sacha_greif.bio
t: Мейнтейнер "Стан JS"
- key: picks.sacha_greif.description
t: |
Поки X повільно божеволів, здавалося, що frontend-спільнота залишилася без дому. Тож дуже приємно бачити, що так багато з нас нарешті сходиться на нову платформу — Bluesky.
- key: picks.dominik_dorfmeister.name
t: Knip
- key: picks.dominik_dorfmeister.bio
t: Інженер програмного забезпечення в Sentry, мейнтейнер React Query
- key: picks.dominik_dorfmeister.description
t: |
Knip — прекрасний інструмент, який аналізує ваш код і повідомляє, чого можна позбутися. Він швидкий (його можна запускати в CI), "товаришує" з багатьма фреймворками і бібліотеками без зайвих налаштувань, а також бездоганно працює в монорепозиторіях.
- key: picks.sebastien_lorber.name
t: Rspack
- key: picks.sebastien_lorber.bio
t: Автор "This Week in React", мейнтейнер Docusaurus
- key: picks.sebastien_lorber.description
t: |
Збирач Rspack — це майже повний безшовний замінник (drop-in replacement) Webpack. Реалізований мовою Rust, він вагомо швидкодійніший, ніж Webpack, і потребує менше пам'яті. Усі проєкти з Webpack повинні негайно його спробувати, зважаючи на легкість впровадження!
###########################################################################
# Sponsors
###########################################################################
- key: sponsors.frontendmasters.description
t: Вдосконалюйте свої навички за допомогою поглиблених сучасних курсів про інженерію клієнтської частини.
- key: sponsors.google_chrome.description
t: Дякуємо команді Google Chrome за підтримку нашої роботи.
- key: sponsors.tokyodev.description
t: Знайдіть роботу розробника своєї мрії в Японії вже сьогодні.
- key: sponsors.renderatl.description
t: Технологічна конференція, присвячена всьому у вебі.
- key: sponsors.gitnation.description
t: |
Дізнайтеся про останні тенденції безпосередньо від перших користувачів та технологічних авторів на GitNation.com
###########################################################################
# FAQ/About
###########################################################################
- key: about.content
t: |
Опитування "Cтан JavaScript 2023" тривало з 13 листопада до 10 грудня 2023 року та зібрало 14015 відповідей. Результати були опубліковані 16 грудня 2024 року. Опитування проводив [Devographics](https://devographics.com/), колектив, до складу якого входять я ([Sacha Greif](https://sachagreif.com/)) і [Eric Burel](https://www.lbke.fr/), а також запрошені експерти та учасники проєктів із відкритим програмним кодом.
Логотип і футболку "Стан JavaScript" розробив [Christopher Kirk-Nielsen](http://chriskirknielsen.com/).
### Цілі опитування
Це опитування було створено для визначення майбутніх тенденцій в екосистемі веброзробки, щоб допомогти розробникам здійснити вибір з-поміж наявних технологій.
Так опитування зосереджено більше на передбаченні того, що станеться протягом наступних кількох років, ніж на аналізі того, що популярно саме зараз, — ось чому деякі функції чи технології іноді можуть не згадуватися попри широке впровадження.
Його також слід сприймати як **знімок певної підмножини розробників у певний момент часу**, а не промовистий опис від імені всієї екосистеми.
### Розробка опитування
Опитування було розроблено частково на основі торішнього опитування з відкритим періодом для зворотного зв'язку, під час якого план опитування обговорювався [на платформі GitHub](https://github.com/Devographics/surveys/issues?q=+label%3A%22State+of+JS+2024%22+).
Усі запитання опитування були необов'язковими.
### Аудиторія опитування
Опитування було повністю відкрите та доступне онлайн, респонденти жодним чином не відфільтровувалися та не відбиралися. Респонденти складалися здебільшого з учасників минулих опитувань (сповіщених електронною поштою за спеціальним списком розсилання) та тих, хто прийшов через соціальні мережі.
Зауважте, що фреймворки, бібліотеки тощо могли вільно заохочувати свою аудиторію до участі в опитуванні, і деякі з них скористалися цим за допомогою банерів, твітів або у інший спосіб. Детальний розподіл джерел трафіку включено в діаграму "Джерела".
### Фінансування проєкту
Цей проєкт фінансується з різних джерел:
- **Продаж футболок**.
- **Розміщення посилань від спонсорів**: посилання на рекомендовані джерела у нижній частині кожної сторінки надають наші партнери [Frontend Masters](https://frontendmasters.com/) та [TokyoDev](https://tokyodev.com/).
- **Пряме фінансування**: цього року [Google](https://www.google.com/) профінансував мою роботу над опитуванням.
Будь-який внесок або спонсорство дуже цінується. Особливо ми хотіли б тісніше співпрацювати з більшою кількістю постачальників браузерів, оскільки вони відіграють центральну роль в екосистемі вебу.
### Технічний огляд
Більш детальний технічний огляд того, як проводяться опитування, [тут](https://dev.to/sachagreif/how-the-devographics-surveys-are-run-2023-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-екосистемі є стільки ж різних посад, скільки і клієнтських фреймворків. Проте очевидна тенденція: будь-яка посада зі словом "інженер" принесе більше доходу — навіть у порівнянні із CEO, CTO чи засновниками. "Розробники", навпаки, посідають найнижчу сходинку і можуть задуматися про нові візитівки…
Щодо демографії, то наймолодші респонденти в середньому займали fullstack- і frontend-посади, й останні також корелювали зі значно вищою часткою жінок.
- 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 для управління монорепо.
- 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, мають успіх серед малих компаній, тоді як рішеннями з вебкомпонентами, як-то 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 поки не може конкурувати з чистими нативними застосунками за швидкодією. React Native і Electron, здається, також отримали на горіхи.
- 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: >
Монорепозиторії ще не стали мейнстримом в екосистемі веброзробки, але для тих, хто наважується взяти цей рубіж, pnpm видається безсумнівним фаворитом.
- key: tools.monorepo_tools_ratios.takeaway.js2024
t: >
Монорепозиторії досі занадто складно налаштувати правильно. Й управління пакетами — це те, що нам ще не вдалося зробити правильно… але, зрештою, кому вдалося?
- key: tools.monorepo_tools_work.takeaway.js2024
t: >
Не дивно, що багато інструментів для монорепозиторіїв використовуються великими компаніями, адже розмір компанії часто корелює з розміром кодової бази.
# 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: >
Незважаючи на всі розмови про програмування за допомогою ШІ, більшість із нас досі використовує ці інструменти досить рідко. Ба більше, 20% взагалі не використовують їх для написання коду.
- key: usage.usage_type.takeaway.js2024
t: >
Завжди корисно знати, в якому контексті респонденти пишуть 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), які ось-ось стануть реальністю. Цього року респонденти найбільше очікують Temporal і декоратори.
- key: usage.top_currently_missing_from_js.takeaway.js2024
t: >
Хоч спільнота давно відчуває нестачу нативної статичної типізації, цікаво бачити, що сигнали посіли третє місце в цьому списку, незважаючи на те, що вони не є частиною найпопулярнішого клієнтського фреймворку.
- key: usage.native_types_proposal.takeaway.js2024
t: >
Очевидно, що респонденти опитування чекають на нативні типи та сподіваються, що вони будуть реалізовані подібно до синтаксису TypeScript.
Цьогорічне формулювання запитання, на жаль, не надало чіткого розмежування між типами у середовищі виконання (runtime types) та типами-анотаціями у стилі TypeScript, тому ще треба з'ясувати, який із цих підходів підтримає спільнота.
# resources
- key: resources.courses.takeaway.js2024
t: >
Udemy успішно залучає популярних інструкторів, як-от Brad Traversy або Colt Steele, щоб доповнити власну колекцію курсів про JavaScript. Також це вдається Frontend Masters (дисклеймер: Frontend Masters підтримує це опитування фінансово).
До того ж варто згадати "Ви не знаєте JS" (You Don't Know JS), чудову книгу, доступну онлайн безкоштовно.
- key: resources.newsletters.takeaway.js2024
t: >
Розсилки — це чудовий спосіб залишатися обізнаними про мінливий світ JavaScript, і "JavaScript Weekly" від Cooperpress продовжує лідирувати у цій сфері.
- key: resources.podcasts.takeaway.js2024
t: >
Хоч "Syntax" наразі зберігає свою корону, його наздоганяють відеоблогери, як-от The Primeagen та Midudev, які можуть вільно генерувати аудіовміст на додаток до традиційних відеовключень.
- key: resources.video_creators.takeaway.js2024
t: >
Fireship, Theo та The Primeagen на вершині рейтингу відеоблогерів. Але варто відзначити квітучість іспанськомовної екосистеми, починаючи з (і не обмежуючись!) Midudev, який посідає четверте місце загалом.
Зауважте, що на другій вкладці показано той самий рейтинг, що вручну відфільтрований лише для іспанськомовних авторів.
- key: resources.people.takeaway.js2024
t: >
Англійська вже довго є панівною мовою в технологічній індустрії, але принаймні в нашому куточку світу іспанська кидає їй виклик. Midudev та Fernando Herrera (DevTalles) очолюють рейтинг найвпливовіших розробників НЕ у відеоформаті.
# metadata
- key: user_metadata.source.takeaway.js2024
t: >
Більшість респондентів дізналася про опитування як учасники попередніх років. Також варто зазначити, що на головних сторінках [Angular](https://angular.dev/) та [Nuxt](https://nuxt.com/) були розміщені банери, які спрямовували їхніх користувачів до опитування; а Bluesky посів п'яте місце, хоч він уперше з'явився як джерело трафіку для опитування.
Також ми провели окремі дії ([детальний звіт тут](https://dev.to/sachagreif/state-of-js-2024-outreach-and-diversity-report-n0e)) із залучення більшої кількості жінок-розробниць.
- key: user_metadata.past_surveys.takeaway.js2024
t: >
Ця діаграма показує, у яких ще опитуваннях від Devographics брали участь цьогорічні респонденти.
Те, що значна частина цих респондентів також брала участь в інших опитуваннях, свідчить, що веброзробка не є настільки розділеною, як здається: навіть якщо ви переважно пишете JavaScript-код, знання CSS та вебплатформи досі є важливим!
Зверніть увагу, що ми можемо згенерувати ці дані лише для автентифікованих респондентів. Гостьові респонденти додані до категорії "Без відповіді".
- key: user_metadata.past_same_survey_count.takeaway.js2024
t: >
Ця діаграма показує, скільки разів цьогорічні респонденти брали участь у попередніх опитуваннях "Стан JS".
Те, що найбільша категорія складається з нових респондентів, означає, що нам успішно вдається досягти нової аудиторії — це зменшує можливість передавання упереджень від наявної аудиторії. На жаль, це також вказує на проблеми заохочення людей до регулярного заповнення опитування рік у рік.
Зверніть увагу, що ми можемо згенерувати ці дані лише для автентифікованих респондентів. Гостьові респонденти додані до категорії "Без відповіді".