DEV Community

Discussion on: Create Reusable Web Components in HTML

Collapse
 
milabron profile image
milabron • Edited

Example? I ask this to see if there is anything special to do when you are not using shadow

Thread Thread
 
milabron profile image
milabron • Edited

I have other doubt it would not have been better to put the template in a method of the Header class, which returns the element in question, especially to have an order, do it as it is now does not give me any help to organize the code. And it's as if it was the same code of all life, even worse because it puts it in a shadow, to which I guarantee you Google doesn't have access.

Thread Thread
 
bennypowers profile image
Benny Powers 🇮🇱🇨🇦

a shadow, to which I guarantee you Google doesn't have access.

I wouldn't take that guarantee. Google search absolutely, 100%, without a doubt DOES read content in shadow DOM. Bing as well.

I have other doubt it would not have been better to put the template in a method of the Header class

If you're using a <template> element, then the template should either be in module scope or a static member of the class. If you make it an instance field or method, you will lose the performance benefit of only parsing the HTML once.

And this is in fact how FASTElement does it. LitElement however lets you define a render method on the instance, which will perhaps be more suitable for you.