Earlier quoted context omitted.
I'm highly interested in approaches that utilize web grain in a balanced practical way. Do you have a framework/toolbelt or example sites to share? Would love to see. If you're interested in my approach to custom elements I created: https://github.com/crisdosaygo/good.html It utlizes custom elements, has autohooks for granular DOM updates, uses native JS template literal syntax for interpolation, imposes ordered comp…
Thanks for sharing, that’s an interesting framework. The self-closing tags are very nice. Unfortunately, I don’t have anything public to show at the moment. Maybe I’ll blog about the approach some day.
You can make up HTML tags
191–200 of 202 posts
Re: You can make up HTML tags
#192Earlier quoted context omitted.
Just keep using Flash? It's called Animate now. https://www.adobe.com/products/animate.html
I know, but since there’s not a great way to deploy and share stuff it’s not the same. Yes I know about Ruffle, but I don’t really want to make a retro game that targets an emulator, I want something that’s consistently updated. Also Animates pricing model is bullshit.
Re: You can make up HTML tags
#193Earlier quoted context omitted.
There's a very clear rule for it: if it contains a dash it's a custom element
That rule doesn't work in reverse. If there's no dash it could be either. So now you've got to try to enforce some practice of using hyphens in all tag names that used to be class names, even if they're a single word that has no place for a hyphen? It's getting even more confusing now, you see? Not less. Just use classes. That's what they're there for.
Re: You can make up HTML tags
#194Re: You can make up HTML tags
#195Earlier quoted context omitted.
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 use…
You know what else can be used in all these contexts? Defined HTML elements
Re: You can make up HTML tags
#196Earlier quoted context omitted.
That rule doesn't work in reverse. If there's no dash it could be either. So now you've got to try to enforce some practice of using hyphens in all tag names that used to be class names, even if they're a single word that has no place for a hyphen? It's getting even more confusing now, you see? Not less. Just use classes. That's what they're there for.
Only native elements can be a single word, you can't create a custom elements without a dash.
You just use it (single word) and style it (CSS) and it works. You don't have to "create" anything.
So nothing's stopping anyone from using single-word elements. There's another comment here defending exactly that:
https://news.ycombinator.com/item?id=46418090
But it's bad practice. Just use classes. It's literally what they are designed for.
Re: You can make up HTML tags
#197Earlier quoted context omitted.
I know, but since there’s not a great way to deploy and share stuff it’s not the same. Yes I know about Ruffle, but I don’t really want to make a retro game that targets an emulator, I want something that’s consistently updated. Also Animates pricing model is bullshit.
You can export it as HTML/CSS/JS and upload it somewhere.
Re: You can make up HTML tags
#198Earlier quoted context omitted.
Only native elements can be a single word, you can't create a custom elements without a dash.
Let's be clear: this whole conversation isn't about custom elements. This is about formatting. Not web components. You just use it (single word) and style it (CSS) and it works. You don't have to "create" anything. So nothing's stopping anyone from using single-word elements. There's another comment here defending exactly that: https://news.ycombinator.com/item?id=46418090 But it's bad practice. Just use classes. It'…
But yeah I also do see the confusion part, if a person new to HTML sees these custom tags being used it might think it can create one too and not realize it must contain a dash, and it would still work. So yeah in that sense, indeed it's confusing if you're unfamiliar with it.
But having multiple at the end of a large block of HTML is also confusing, often resulting in closing too many / too few divs. Having is much better. So yeah it has it's pros and cons I guess.
Re: You can make up HTML tags
#199Earlier quoted context omitted.
this.querySelector will return nothing when you define this Web Component before (light)DOM is parsed, because the connectedCallback fires on the opening tag. Above code will only work when the Web Component is defined after DOM has parsed; using "defer" or "import" makes your JS file execute after DOM is parsed, you "fixed" the problem without understanding what happened. I blogged about this long time ago: https://…
Well, that's why I include JS files at the bottom of my HTML body, to make sure to avoid exactly this problem: https://github.com/yawaramin/dream-html-ui/blob/92f2dfc51b75...
► execute at bottom of file
► execute
Both do the same; they execute script after DOM was parsed. When your JS creates GUI you now have to battle FOUCs.
► "import" loads your script async
so it _could_ load before _all_ DOM has parsed... but 9999 out of 10000 scenarios it won't
Re: You can make up HTML tags
#200I used this to implement , the opposite of , to be able to designate sections of a page to be hidden if JS was disabled. You can of course do the same thing with classes, but custom tags are fun. https://github.com/aaviator42/yes-script
By the way, you can also do this pure CSS using the scripting media feature: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/A...