5 ms·

By default, they will behave like spans. You can customize it using the Custom Element API: https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Usi

by ok123456 10mo ago

By default, they will behave like spans. You can customize it using the Custom Element API: https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements https://developer.mozilla.org/en-US/docs/Web/API/Web_compone...

lofties 10mo ago
I used custom elements extensively in 2014 when support was not as widespread. I think it's a beautiful, elegant solution and I'm still a little bit bitter that React became as big as it was. Now everything "has" to be a SPA because developers want to use React, whereas most users would actually be better served with good 'ol HTML with some custom elements where needed.
- teaearlgraycold 10mo ago
  I’ve been getting into SSR with JSX as a template engine using kita. You still get full typescript analysis and composability. It beats any other SSR web templating system I’ve used. I agree the need for everything to be a react app by default has gotten out of control. But I think if you’re a startup with unknown future needs it’s hard to ignore the flexibility and power of something like react. If you know you’re just making a CRUD app and good old fashioned form POSTs will do then it’s beautiful to have that speed and the lightweight pages.
  - skeptic_ai 10mo ago
    You do the crud app and then they want: just make this to edit inline. You do some Ajax api Call with a tiny js. Then you need more and more. Then you have a mess and you’d be better with react. I still can’t find a project id be better of without react. When I tried without it bite me very quickly.
    - teaearlgraycold 10mo ago
      Nothing wrong with JS. It all depends on whether you have a strong sense of the bounds of the project.
- toastal 10mo ago
  > Now everything "has" to be a SPA because developers want to use React Have you followed anything in the last 5 years? Outside of bootcamp students, this has been on the decline for a while… in some cases overcorrecting for where a SPA might make more sense.
- troupo 10mo ago
  > I think it's a beautiful, elegant solution Very confused by statements like these. They are extremely verbose. They are too high level, preventing many low-level optimizations. They are too low-level, preventing you from using/implementing them without going into the details of how they actually work. They break many platform assumptions and conventions, creating no end of problems both for end users and implementers, and needing dozens of new specifications to fix glaring holes that exist only because web components exist. All of those specs? A heavy dousing of Javascript of course. Even the people who push them heavily cannot agree on what they are good is and what the goal of them is
  - WickyNilliams 10mo ago
    What makes custom elements good is inrerop. I can use them in react, Vue, angular, svelte, solid, or just plain ol' server rendered html. I can switch out the internals entirely for a WC lib, or not, with nobody knowing or caring. This is a unique advantage to WCs. And it's such a compelling advantage that it makes almost all the downsides tolerable. At least if you are in a position where your component might be used in many places. Design Systems are a good example. The consumer can be any app, built on any technology. And there are plenty of downsides. But they are mostly felt by the author, not the consumer. Similar to how TS libs can be very complex to author because of type level gymnastics, but when done right are easy to consume. (I do not push them heavily, but I can appreciate strengths and weaknesses of all tools)
    - troupo 10mo ago
      > At least if you are in a position where your component might be used in many places. I think someone once called them leaf components, and on this I agree.
      - WickyNilliams 10mo ago
        They don't need to be leaf components to still have this strength. I've worked with design systems which have a <my-layout> component near the root which defines sidebar, header etc slots. This still works nicely with react, Vue etc But I agree they tend to be better suited as "leafier" components
- halfmatthalfcat 10mo ago
  SPAs are early 2010s homie. SSR has been dominant for the past 5 years.
zikani_03 10mo ago
I would rather use semantic elements for the examples like the one in the article and use web components/custom elements where appropriate. Web Components are underrated for sure. I had a need for a custom element[0] and it was not difficult to implement. [0]: https://github.com/zikani03/hypalink https://github.com/zikani03/hypalink

lofties 10mo ago

I used custom elements extensively in 2014 when support was not as widespread. I think it's a beautiful, elegant solution and I'm still a little bit bitter that React became as big as it was. Now everything "has" to be a SPA because developers want to use React, whereas most users would actually be better served with good 'ol HTML with some custom elements where needed.

teaearlgraycold 10mo ago
I’ve been getting into SSR with JSX as a template engine using kita. You still get full typescript analysis and composability. It beats any other SSR web templating system I’ve used. I agree the need for everything to be a react app by default has gotten out of control. But I think if you’re a startup with unknown future needs it’s hard to ignore the flexibility and power of something like react. If you know you’re just making a CRUD app and good old fashioned form POSTs will do then it’s beautiful to have that speed and the lightweight pages.
- skeptic_ai 10mo ago
  You do the crud app and then they want: just make this to edit inline. You do some Ajax api Call with a tiny js. Then you need more and more. Then you have a mess and you’d be better with react. I still can’t find a project id be better of without react. When I tried without it bite me very quickly.
  - teaearlgraycold 10mo ago
    Nothing wrong with JS. It all depends on whether you have a strong sense of the bounds of the project.
toastal 10mo ago
> Now everything "has" to be a SPA because developers want to use React Have you followed anything in the last 5 years? Outside of bootcamp students, this has been on the decline for a while… in some cases overcorrecting for where a SPA might make more sense.
troupo 10mo ago
> I think it's a beautiful, elegant solution Very confused by statements like these. They are extremely verbose. They are too high level, preventing many low-level optimizations. They are too low-level, preventing you from using/implementing them without going into the details of how they actually work. They break many platform assumptions and conventions, creating no end of problems both for end users and implementers, and needing dozens of new specifications to fix glaring holes that exist only because web components exist. All of those specs? A heavy dousing of Javascript of course. Even the people who push them heavily cannot agree on what they are good is and what the goal of them is
- WickyNilliams 10mo ago
  What makes custom elements good is inrerop. I can use them in react, Vue, angular, svelte, solid, or just plain ol' server rendered html. I can switch out the internals entirely for a WC lib, or not, with nobody knowing or caring. This is a unique advantage to WCs. And it's such a compelling advantage that it makes almost all the downsides tolerable. At least if you are in a position where your component might be used in many places. Design Systems are a good example. The consumer can be any app, built on any technology. And there are plenty of downsides. But they are mostly felt by the author, not the consumer. Similar to how TS libs can be very complex to author because of type level gymnastics, but when done right are easy to consume. (I do not push them heavily, but I can appreciate strengths and weaknesses of all tools)
  - troupo 10mo ago
    > At least if you are in a position where your component might be used in many places. I think someone once called them leaf components, and on this I agree.
    - WickyNilliams 10mo ago
      They don't need to be leaf components to still have this strength. I've worked with design systems which have a <my-layout> component near the root which defines sidebar, header etc slots. This still works nicely with react, Vue etc But I agree they tend to be better suited as "leafier" components
halfmatthalfcat 10mo ago
SPAs are early 2010s homie. SSR has been dominant for the past 5 years.

zikani_03 10mo ago

I would rather use semantic elements for the examples like the one in the article and use web components/custom elements where appropriate. Web Components are underrated for sure. I had a need for a custom element[0] and it was not difficult to implement. [0]: https://github.com/zikani03/hypalink https://github.com/zikani03/hypalink