1

I know that Custom Elements were introduced a long time ago. And according to Caniuse, most major browsers already support it. But I and my Team Lead are still curious whether its support is wide enough to use Custom Elements in commercial projects. Do we need polyfills or not?

In my opinion, Autonomous custom elements cover most cases where Custom Elements are needed and I voted for using them.

P.S.: Ignore Internet Explorer.

Kapelianovych
  • 67
  • 5
  • 2
    Please include a detailed description what you mean by "safe" in this context and/or what your requirement for "safe" is. – Progman Jun 05 '21 at 09:51
  • I use web components for mission critical views in production since 2018 and haven't got fired. By now we have more the 200 of them. It was a slippery slope but its good to have some standards on the long run. – Tiberiu C. Aug 03 '21 at 11:14

3 Answers3

2

TL;DR; Yes, Web Components is a standard ... no polyfills required

  • Custom Elements API
  • shadowDOM
  • Templates

Are the 3 technologies what we also call "Web Components"

each can be used without the other!

  • HTML Imports was scrapped
  • Some include ES Imports

"Web Components" are a W3C standard and supported in all modern Browsers:

Chrome (and Edge, Brave and others running on Chromium), Safari and FireFox

They are as much a standard as any other ES technology

Don't get misguided by old blogs discussing (what we now call) the "V0" standard; which mainly was a Google lets-throw-something-against-the-wall-and-see-what-sticks party only; with input from Mozilla and Apple.

Web Components V1 (since early 2018) is a solid joint effort by Apple, Mozilla and Google.

Microsoft joined the party when they decided to swap Browser engines and make Edge run on Chromium

(Historically) there are 2 types of Custom Elements:

  • Autonomous Custom Elements, extend from HTMLElement
  • Customized Built-In Elements, extends from any HTML Element (eg: HTMLButtonElement)

Apple has stated, since 2016, they won't implement the latter! (and most who dig deeper, say Apple is right on this one)

It also worth to note, in august 2019, the W3C signed an agreement that the WHATWG
(that is: Apple + Google + Mozilla + Microsoft) is in charge of all HTML and DOM developments; the W3C will only give final approval on standards.

Setting standards is a slow (but steady!) process, because all 4 companies have to agree now.
But just think... Web History has been nothing but (browser) wars...
have you ever seen co-operation like this in the Webs 30 year history?
So what will the future bring?

One new war is already being fought... oblivious to many developers
Note the one big "front-end" name missing...
and the WHATWG is "By invitation only"

Also read: main differences React, Lit, Web Components

Danny '365CSI' Engelman
  • 16,526
  • 2
  • 32
  • 49
1

In my experience you can use custom elements. I have been using custom elements for a project for years now and never had any issues or case where they were not implemented by the browser as I intended for them to be.

Just make sure you style correctly where necessary.

Osawere
  • 11
  • 2
-1

You can use custom elements. I have used custom elements long time ago ,now i never use ,it because it will be difficult to work with a team ,Thats for sure.Its always best practice to minimize the use of custom elements ..

brown
  • 31
  • 1
  • 7