4 ms·

This one confuses me: > Where libraries are necessary, use libraries that leverage html attributes over libraries built around javascript or custom syntax And

This one confuses me: > Where libraries are necessary, use libraries that leverage html attributes over libraries built around javascript or custom syntax And then they demo using _hyperscript [0] as encouraged. However, that's a library built around a custom syntax. It's only using an HTML attribute to encode a script that's in a new language you need to learn. Is this serious? [0] https://hyperscript.org https://hyperscript.org

gbro3n 3y ago
Alpine.js would have been a better recommendation according to the authors advice as it is straight forward JS plus HTML attributes.
dartos 3y ago
I think hyperscript has some people trying to hype it up bc it’s related to HTMX, but imo is more of a fun novelty.
mattlondon 3y ago
I would agree - the example of an an attribute of `_` and then some obscure DSL statement as a value looks super weird and confusing. I would rather there was just an explicit `onclick` (or some other event) in there with a vanilla JavaScript statement so I know what is happening.
brennopost 3y ago
Maybe the author swapped the encouraged and discouraged.
recursivedoubts 3y ago
yeah, kinda. source: I'm the creator of hyperscript.
- Jtsummers 3y ago
  I'm not saying hyperscript isn't serious (I have no opinion on it at all actually). I'm saying the claim "avoid DSLs" followed by an example using a DSL is a sign of unseriousness on the part of the author of HTML First. Six principles and one of them is presented with an example that blatantly violates that same principle. I could see a mistake like this slipping through if there were many more principles and examples, but this is a relatively short piece for such an error to slip in.
- arcanemachiner 3y ago
  Perfect. This place is overdue for an exhaustive debate about HATEOAS/REST/etc, and you have an incomparable talent for starting such a debate.
  - recursivedoubts 3y ago
    not to brag, but that is kinda my superpower...
athrowaway3z 3y ago
I suspect this is a 'List of tips' written explicitly to promote hyperscript. Its example is also pretty weak. Vanilla solutions (Tip 1) works just as well: <div> <input type="text" oninput="this.nextElementSibling.innerText = this.value"/> <div id="output"></div> </div>
- assimpleaspossi 3y ago
  note that the <input> tag does not use and does not need a closing slash and never has in any HTML specification. https://html.spec.whatwg.org/dev/embedded-content.html#the-input-element https://html.spec.whatwg.org/dev/embedded-content.html#the-i...
  - josephg 3y ago
    Yep. It’s one of a handful of void elements along with <img> and <br>. Also using a slash to self close a tag is not part of the html spec and it never has been part of the spec. The browser doesn’t know what that means on any tag. If you write <div /> the browser ignores the slash and thinks you still haven’t closed your Div.
    - zlg_codes 3y ago
      I'm adding context to this because you're only telling part of the story: self-closing tags are necessary for void elements in XML and XHTML, both technologies that are still supported on the Web. Since XHTML processes HTML as XML, it forces it to be well-formed. Unlike HTML, which has all sorts of tag-soup and quirks modes and other things, because it's lax in its syntax. Void elements lacking the need for a closing tag or closing slash is one of the weird edge cases in HTML. While it's not in the HTML spec, it may still be seen in the wild in XML and XHTML documents and is not universally bad or unsupported.
      - josephg 3y ago
        You can view HTML as a weird, quirky version of XHTML if you want. But XHTML lost the war. Browsers are HTML5 engines, not XHTML engines. And if you're writing HTML, the browser considers <br/> to just be a weird way to write <br>. The slash is non-significant. So confusingly <script /> is not equivalent to <script></script>. The problem I have with self-closing tags is that I've met so many web developers throughout my career who think that browsers understand self closing tags. I used to be one of them! And that will almost always, but not always work out fine: - React / JSX supports self closing tags. So do a lot of other web frameworks. - Void elements ignore the /. (And you don't need to close void tags anyway). So you can write input, img, br, etc tags however you want. - HTML5 will auto-insert missing closing tags when it needs them. Eg, <div><span /></div> will render as you expect because the browser will automatically close the span when you close the div. (!) But it'll confuse you in weird ways. Like <script src="..." /> - which the browser dangerously interprets as an open script tag. Subsequent text is interpreted as javascript! I think its good practice to be clear in all source files whether you're writing XHTML (eg in .jsx) or writing real, god fearing HTML. And then never use self closing tags in HTML. Sooner or later, someone will think they matter and you'll get bugs.
rbosinger 3y ago
Yeah I stopped reading as soon as I saw this one.

gbro3n 3y ago

Alpine.js would have been a better recommendation according to the authors advice as it is straight forward JS plus HTML attributes.

dartos 3y ago

I think hyperscript has some people trying to hype it up bc it’s related to HTMX, but imo is more of a fun novelty.

mattlondon 3y ago

I would agree - the example of an an attribute of `_` and then some obscure DSL statement as a value looks super weird and confusing. I would rather there was just an explicit `onclick` (or some other event) in there with a vanilla JavaScript statement so I know what is happening.

brennopost 3y ago

Maybe the author swapped the encouraged and discouraged.

recursivedoubts 3y ago

yeah, kinda. source: I'm the creator of hyperscript.

Jtsummers 3y ago
I'm not saying hyperscript isn't serious (I have no opinion on it at all actually). I'm saying the claim "avoid DSLs" followed by an example using a DSL is a sign of unseriousness on the part of the author of HTML First. Six principles and one of them is presented with an example that blatantly violates that same principle. I could see a mistake like this slipping through if there were many more principles and examples, but this is a relatively short piece for such an error to slip in.
arcanemachiner 3y ago
Perfect. This place is overdue for an exhaustive debate about HATEOAS/REST/etc, and you have an incomparable talent for starting such a debate.
- recursivedoubts 3y ago
  not to brag, but that is kinda my superpower...

athrowaway3z 3y ago

I suspect this is a 'List of tips' written explicitly to promote hyperscript. Its example is also pretty weak. Vanilla solutions (Tip 1) works just as well: <div> <input type="text" oninput="this.nextElementSibling.innerText = this.value"/> <div id="output"></div> </div>

assimpleaspossi 3y ago
note that the <input> tag does not use and does not need a closing slash and never has in any HTML specification. https://html.spec.whatwg.org/dev/embedded-content.html#the-input-element https://html.spec.whatwg.org/dev/embedded-content.html#the-i...
- josephg 3y ago
  Yep. It’s one of a handful of void elements along with <img> and <br>. Also using a slash to self close a tag is not part of the html spec and it never has been part of the spec. The browser doesn’t know what that means on any tag. If you write <div /> the browser ignores the slash and thinks you still haven’t closed your Div.
  - zlg_codes 3y ago
    I'm adding context to this because you're only telling part of the story: self-closing tags are necessary for void elements in XML and XHTML, both technologies that are still supported on the Web. Since XHTML processes HTML as XML, it forces it to be well-formed. Unlike HTML, which has all sorts of tag-soup and quirks modes and other things, because it's lax in its syntax. Void elements lacking the need for a closing tag or closing slash is one of the weird edge cases in HTML. While it's not in the HTML spec, it may still be seen in the wild in XML and XHTML documents and is not universally bad or unsupported.
    - josephg 3y ago
      You can view HTML as a weird, quirky version of XHTML if you want. But XHTML lost the war. Browsers are HTML5 engines, not XHTML engines. And if you're writing HTML, the browser considers <br/> to just be a weird way to write <br>. The slash is non-significant. So confusingly <script /> is not equivalent to <script></script>. The problem I have with self-closing tags is that I've met so many web developers throughout my career who think that browsers understand self closing tags. I used to be one of them! And that will almost always, but not always work out fine: - React / JSX supports self closing tags. So do a lot of other web frameworks. - Void elements ignore the /. (And you don't need to close void tags anyway). So you can write input, img, br, etc tags however you want. - HTML5 will auto-insert missing closing tags when it needs them. Eg, <div><span /></div> will render as you expect because the browser will automatically close the span when you close the div. (!) But it'll confuse you in weird ways. Like <script src="..." /> - which the browser dangerously interprets as an open script tag. Subsequent text is interpreted as javascript! I think its good practice to be clear in all source files whether you're writing XHTML (eg in .jsx) or writing real, god fearing HTML. And then never use self closing tags in HTML. Sooner or later, someone will think they matter and you'll get bugs.

rbosinger 3y ago

Yeah I stopped reading as soon as I saw this one.