İçeriğe atla

State of HTML 2025

Web Componentleri

Web component'leri oluşturma ve kullanma.

We're highlighting up-and-coming features or libraries we think you should know about.

Feature Highlight: ElementInternals

Web bileşenleri yazıyorsanız, sık sık özel sözde sınıflar, varsayılan ARIA parametreleri belirlemeniz veya bir bileşenin normal bir form öğesi gibi davranmasını sağlamanız gerekmiş olabilir mi?

ElementInternals tüm bunları ve daha fazlasını yapar! En iyi yanı ne mi? 2023'ten beri tüm tarayıcılar tarafından desteklenen, yaygın olarak kullanılabilir bir araç olması!

Baseline: Widely Available

Learn more

Useful Resources

Diğer Web Component Özellikleri

Bir kez daha, declarative custom elementsin duygu grafiğinde en üst sırada yer almasıyla, deklaratif çözümlerin hakim olduğunu görüyoruz.

Group by:

Sort by:

01
Web Componentleri
52.6%
35.8%
10.4%
4,457
02
Web Componentleri
46.9%
37.6%
14.9%
4,445
03
Web Componentleri
40%
43.7%
15.7%
4,437
04
Web Componentleri
31.4%
30.9%
37.4%
4,430
05
Web Componentleri
12.9%
34.2%
52.5%
4,404
06
Web Componentleri
9.9%
29.6%
60.2%
4,425
07
Web Componentleri
7.3%
17.4%
75%
4,387
08
Web Componentleri
5.9%
11.9%
81.8%
4,372
09
Web Componentleri
5.1%
15%
79.7%
4,366
10
Web Componentleri
4.8%
17.1%
77.6%
4,402
11
Web Componentleri
8.2%
89.9%
4,364

Deneyim

  • Daha önce kullandım: Respondents who have used an item.
  • Hakkında bilgim var: Respondents who have heard about an item, but haven't used it.
  • Daha önce hiç duymadım: Respondents who have never heard about an item.

Duygu

  • Pozitif: Bir teknoloji hakkında daha fazla bilgi edinmek isteyen veya bu teknolojiyi tekrar kullanmak isteyen katılımcılar.
  • Nötr: Bir teknoloji hakkında herhangi bir duygu belirtmeyen yanıtlayıcılar.
  • Negatif: Bir teknoloji hakkında daha fazla bilgi edinmekle ilgilenmeyen veya bu teknolojiyi kullanmış ve olumsuz bir deneyim yaşamış katılımcılar.
“Used” average:20%
“Positive” average:24%
“Negative” average:7%

Web Components Pain Points

What are your top pain points around making and using web components?
Multiple
0%
20%
40%
60%
80%
100%
01
Excessive complexity
1,710
02
Over-reliance on JavaScript & SSR issues
1,225
03
Accessibility issues
1,017
04
Extending native elements
784
05
Overly strict style encapsulation
708
06
Accessing design tokens
486
07
Localization/internationalization issues
352
08
Low shadow DOM CSS specificity
339
09
Slotted descendant styling
317
10
🚫 Yok
313
0%
20%
40%
60%
80%
100%
% of question respondents
3,232
52%
10

Other Web Components Pain Points

Önceki yıllara kıyasla aynı temalar hala geçerli: yüksek bilişsel aşırı yük, çerçeve bileşenlerine kıyasla yetersizlik ve Shadow DOM'un çözümden çok sorun olması.

Any other pain points around making and using web components?
Multiple
Top pain point topics overall.

View:

Items that are not one of “limitations”
0%
20%
40%
60%
80%
100%
01
Cognitive overload
3
02
Ecosystem issues
1
03
2
04
Content
1
05
Styling & customization
1
06
Excessive complexity
07
Browser support
1
08
Education
3
09
Declarative APIs
10
Accessibility
11
Web Components extending built-in elements
12
Adoption & momentum
13
Slotting & Slots
2
14
Web Components styling & theming
2
15
Server-client communication
1
16
Reliance on JavaScript
17
Reactivity
1
18
Tooling
1
19
Loading & packaging
20
Loading
21
community
22
ElementInternals
23
Custom element attributes and props
1
24
Invalid/Spam
25
Form Submission
26
Other Answers
0%
20%
40%
60%
80%
100%
% of question respondents
348
6%
25
5

Recommended Resources

Vanilla JS: You Might Not Need a Framework
Maximiliano Firtman
Software Engineer & Educator

Vanilla JS: You Might Not Need a Framework

See how you can build rich web apps and websites without depending on libraries or frameworks, using only the core JavaScript language.
Sponsored content from our partners. Learn more.