Hacker News Reader

Comment by jdemler | Hacker News Reader

I have a vastly different experience: At CurrySoftware we used style-elements[1] to build a internal frontent for a client. The whole project only contains 15 lines of HTML that sets up the elm-app. Zero CSS or other HTML.

Try it out. IMO it changes everything about frontend development.

[1]: http://package.elm-lang.org/packages/mdgriffith/style-elemen...

View on HN

Do you have any experience of how easy it is to add accessibility information or attributes when using style-elements? If it generates its own HTML and doesn't give you access to things like ARIA, that is a concern.

Thank you. I hadn't heard of this and it's really interesting. What are the downsides of that approach? Is style-elements as full featured as you'd want?

It is pretty much fully featured as what you would need in any typical web-app.

One crucial thing that is missing is guaranteed browser support. That is why we only used it for the clients internal frontend. But as I understand it, this will be addressed in the upcoming 5.0 release.

Also the resulting HTML is not always as optimal as I would hope.

All in all development is just so much faster and cleaner. No need to worry about layout and style. After using style-elements for a while, HTML + CSS seem like a really stupid idea to describe layout and style.

That's not much different from a React app, in terms of how much HTML needs to be involved. As low as 9 lines, if you want (basic HTML scaffold + root element).

I'd think a particularly adventurous person could do it without writing any HTML and just create the scaffolding directly in the DOM before the app is mounted, but that would be a little silly.

But the story inside the app is different:

React (at least as I understand it): The app emits HTML and CSS you wrote

Elm + style-elements: The app emits HTML and CSS you described

You aren't writing HTML in React and there are a number of libraries to replace writing CSS

This is interesting, but how accessible / semantic is the markup it produces? Is it smart enough to see that I'm iterating over a list and producing an element for each item, and output <li>, for example?

> how accessible / semantic is the markup it produces

Not very, from my experience. You would basically need to introduce a sourcemap equivalent.

Reply on news.ycombinator.com