Ir para o conteúdo

State of HTML 2025

Componentes Web

Criação e uso de componentes web.

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

Feature Highlight: ElementInternals

If you write web components, you must have often needed to specify custom pseudo-classes, default ARIA parameters, or to make a component behave like a regular form element?

ElementInternals does all that, and more! The best part? It’s Widely Available, supported by all browsers since 2023!

Baseline: Widely Available

Learn more

Useful Resources

Other Web Component Features

Once again we see declarative solutions prevailing, with declarative custom elements topping the sentiment chart.

Agrupar por:

Ordenar por:

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

Experience

  • Já usei: Respondents who have used an item.
  • Conheço: Respondents who have heard about an item, but haven't used it.
  • Nunca ouvi falar: Respondents who have never heard about an item.

Sentiment

  • Positive: Respondents who are interested in learning more about a technology; or are willing to use it again.
  • Neutral: Responents who did not indicate any sentiment about a technology.
  • Negative: Respondents who are not interested in learning more about a technology; or have used it and had a negative experience.
“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
🚫 None
313
0%
20%
40%
60%
80%
100%
% de respostas das questões
3,232
52%
10

Other Web Components Pain Points

Compared with previous years the same themes are still present: high cognitive overhread, falling short when compared to framework components, and Shadow DOM being more of a problem than a solution.

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
Outras respostas
0%
20%
40%
60%
80%
100%
% de respostas das questões
348
6%
25
5

Recursos recomendados

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.
Obrigado aos nossos parceiros por nos apoiarem! Saiba mais.