DEV Community

Why are Web Components interesting?

Robert Rees on March 11, 2024

I've been increasingly interested in Web Components and trying to understand how I can rewrite my historic code to use this standard. Most develope...
Collapse
 
hendrikras profile image
Hendrik Ras

You are certainly right about the lock-in of these frameworks. However with SSR being the trend it is nowadays, frameworks like React can be used without browsers even needing to have JavaScript enabled in the browser.
That may not sound like much of an argument, but there really are some valid cases where you would need the UI to still work without JavaScript. What would be your take on that?

Collapse
 
dannyengelman profile image
Danny Engelman

Can you name those valid cases?

Collapse
 
hendrikras profile image
Hendrik Ras

Sure, I once read about a case where they were developing a website for suicide prevention. The design philosophy there was that the site should always present the information, the site should not be dependent on JavaScript to display, just in case it was turned off.

There is a growing number of people that choose to turn it off because they do not want to be tracked.

Lastly, although screen readers and other accessibility tools nowadays can cope pretty well with the modern web, those tools still struggle with SPA's.

Thread Thread
 
dannyengelman profile image
Danny Engelman

"I once read"

"a growing number people"

Where are the sites that actual do not run on JS?

Thread Thread
 
hendrikras profile image
Hendrik Ras

You can turn off JavaScript and see for yourself. Government websites would be a good place to start.

Collapse
 
hendrikras profile image
Hendrik Ras

Fair enough, answer me this though. One of the selling points is that you could use them in any framework. So when switching from Vue to React or Svelte and with the use of SSR like Next or SvelteKit, for whatever reasons (performance?). Will those Web Components still hold up on the server side?

Collapse
 
eason_duan_98090c25063764 profile image
Eason Duan

First of all, web components is a really good creation .It has solved some special problems in some station, but I did't think it could be applied widely because of:

  1. The mental burden on developers, use web components means you will concern data interaction and the corresponding page interaction! Trust me, The mental burden brought by imperative programming is far greater than the declarative programming brought by frameworks like react and vue....

2.Development Efficiency, Although, it has like: lit,omi etc base web components framework, accomplish a web component is harder than use Vue, React..(Specifically reflected in: no css html Syntax Tips, want to use css framework...)

3.SSR work, Although, declarative shadow dom become more and more complete recently(92% browser support), it does't means this will suitable for all situations, as modern front-end server rendering becomes more and more complex, there are more and more situations

Collapse
 
rrees profile image
Robert Rees

I'm not sure why you think Web Components have to be written in an imperative way, I'm not sure that's true but its unclear what you mean by imperative here.

As I say in the post, I don't think it is possible to change the mind of people who like frameworks like React etc. and I don't think it is worth the energy to try and do so. There is a lot of confusion about equating Web Components with these frameworks, which I think is present in your comment (in the way you talk about CSS and SSR). Web Components aren't a framework so why try to compare them?

Collapse
 
xwero profile image
david duymelinck

I mostly write backend code, and web components can be used without jumping through hoops to pass data.

It is also easier to control the javascript and css that is send to the browser. Sending a template engine to the browser, always felt wrong to me.

The newest javascript frameworks are more in line with my view of splitting frontend and backend work. But if a backend developer wants to create a frontend contribution they need to learn the custom way of doing things in that framework. That knowledge can't be carried on to another project that doesn't have that framework.
Web components will work without an extra framework.