Live data from Hacker News

You can make up HTML tags

maurycyz.com

191–200 of 202 posts

Re: You can make up HTML tags

#191

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.

Well, I hope to see it.

Re: You can make up HTML tags

#192

Earlier 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.

You can export it as HTML/CSS/JS and upload it somewhere.

Re: You can make up HTML tags

#193

Earlier 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.

Only native elements can be a single word, you can't create a custom elements without a dash.

Re: You can make up HTML tags

#195

Earlier 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

Not even sure what argument you're making here. A web component bundles one or more of: markup, styles, functionality. You can't do that with just html such that it's easily consumable in all the ways I mentioned.

Re: You can make up HTML tags

#196

Earlier 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.

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's literally what they are designed for.

Re: You can make up HTML tags

#197

Earlier 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.

I haven’t tried that lately but when I tried that a few years ago it was terrible.

Re: You can make up HTML tags

#198

Earlier 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'…

Aha fair enough, but yeah browsers often allow invalid HTML to just work. But that doesn't mean that the valid usage is somehow flawed. I can understand that the dash can be a bit of a weird rule if you're new to HTML. But I think it's an elegant way to allow users to create custom tags and have readable compact semantic HTML.

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

#199
post #87

Earlier 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...

One drawback.

► 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

#200
post #101

I 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...

I would suggest not using this as it's not compatible with NoScript
Post reply on HN