Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

React v16.2.0: Improved Support for Fragments

reactjs.org

Post reply on HN
Print view View original

31–40 of 47 posts

Re: React v16.2.0: Improved Support for Fragments

#31

Post by spoiler »

ojosilva wrote: post #30

Ive started with React recently and strangely the lack of fragments were one of the things that caught my attention in the first days. Another thing I'm looking for in React as I get started is better styling support. I'm resourcing to React JSS for that, but I feel it should be part of the language. The web trinity if you may is HTML-CSS-JS and React basically left CSS out half-baked into almost unusable style attri…

I agree with you that CSS support is a bit lacking. I think they did this on purpose though, because many people prefer CSS preprocessors like SCSS/Sass or Less. However, with Create React App, you get nice CSS support via webpack and PostCSS. I recommend you check out styled-components; getting used to the back tick syntax takes some time, but after you do get used to it, working with them is really nice. Also, Babel syntax highlighting (in Atom at least) properly highlights the CSS used in styled-component.

Re: React v16.2.0: Improved Support for Fragments

#32

Post by worldsayshi »

ojosilva wrote: post #30

Ive started with React recently and strangely the lack of fragments were one of the things that caught my attention in the first days. Another thing I'm looking for in React as I get started is better styling support. I'm resourcing to React JSS for that, but I feel it should be part of the language. The web trinity if you may is HTML-CSS-JS and React basically left CSS out half-baked into almost unusable style attri…

I've found styled components to be a nice attempt at bundling styles with the component. Haven't tried that many options though.

It has out of the box support in Atom and scss (like?) syntax.

https://github.com/styled-components/styled-components

Re: React v16.2.0: Improved Support for Fragments

#33

Post by aidos »

ojosilva wrote: post #30

Ive started with React recently and strangely the lack of fragments were one of the things that caught my attention in the first days. Another thing I'm looking for in React as I get started is better styling support. I'm resourcing to React JSS for that, but I feel it should be part of the language. The web trinity if you may is HTML-CSS-JS and React basically left CSS out half-baked into almost unusable style attri…

Another vote for styled-components. I tried everything I could (model and library wise). That's the one that felt the most natural to me.

Re: React v16.2.0: Improved Support for Fragments

#34

Post by nimos »

danabramov wrote: post #9
nimos wrote: post #7

Earlier quoted context omitted.

Fibers? I thought they were implemented and that was what React 16 was all about.

From React 16 blog post ( https://reactjs.org/blog/2017/09/26/react-v16.0.html ): >We think async rendering is a big deal, and represents the future of React. To make migration to v16.0 as smooth as possible, we’re not enabling any async features yet , but we’re excited to start rolling them out in the coming months. Stay tuned! The rewrite was about adding the foundation for making this even possible . But there's s…

Ah ok thanks, not super familiar with react. Had seen a video about fibers/async and saw something about 16 implementing them. Put 2 and 2 together and got 5.

Re: React v16.2.0: Improved Support for Fragments

#35

Post by negativ0 »

Fifer82 wrote: post #16

I just can't help but sneer. Opinionated document.write() using "jsx". Working with react has been the worst experience of my life. I had to call a meeting and laid in down in October. If 2018 is React, I am leaving on Dec 31. So soon I am going swiftly back into the arms of Angular and I can't wait. Honestly, my eyes are blurring as I type this with pure happiness. Enjoy the fragments guys, it will be good practice…

you are totally right

Re: React v16.2.0: Improved Support for Fragments

#36

Post by [deleted] »

sotojuan wrote: post #22
Fifer82 wrote: post #16

I just can't help but sneer. Opinionated document.write() using "jsx". Working with react has been the worst experience of my life. I had to call a meeting and laid in down in October. If 2018 is React, I am leaving on Dec 31. So soon I am going swiftly back into the arms of Angular and I can't wait. Honestly, my eyes are blurring as I type this with pure happiness. Enjoy the fragments guys, it will be good practice…

Next time post this kind of stuff on your blog, not HN comments.

[deleted]

Re: React v16.2.0: Improved Support for Fragments

#37

Post by yladiz »

Man, although fragments are a pretty useful concept, the implementation is really terrible. It feels so uninspired and without thought of the design, in my opinion. They could have chosen some character instead of an empty tag and it would have been much better, like an asterisk[1], because it would be clear that the tag serves a defined purpose. I would almost argue that if this weird shorthand is necessary to accomplish this task (something that irked me when creating text heavy pages) then JSX should be redesigned to handle it natively without the weird fragment syntax.

1: Like this:

   ...

Re: React v16.2.0: Improved Support for Fragments

#38

Post by electric_sheep »

danabramov wrote: post #23
hobofan wrote: post #20

Earlier quoted context omitted.

Sure, we can call it syntax. Of course, for anyone who already knows what it does, it's just a transform, but the problem with extra syntax is that it makes it harder for newcomers to pick it up. Taking your example when putting it in front of someone seeing it for the first time: In: Out (Newcomer): WTF does that mean? Did someone forget to put something in those tags?

Same newcomer, in a couple of weeks: "Don't know how I lived without it". I understand your point, but in practice people love tiny affordances like this, especially when they are needed as often as fragments are. This is a balance, but it's important to consider the needs of power users too. Beginners don't stay beginners forever. We've thought about this for a few months, and decided that adding syntax would be bet…

Yeah, it seems like the decision to make the fragment a first-class JSX concept has a lot to do with portability between renderers. The post makes it clear you all have given this a lot of thought and care, and I appreciate that (even if it will take me awhile to get used to seeing empty tags, haha).

Re: React v16.2.0: Improved Support for Fragments

#39

Post by electric_sheep »

hazza1 wrote: post #28
acdlite wrote: post #18

Earlier quoted context omitted.

> The Fragment syntax adds some additional magic to JSX (which is rarely a good thing) In: Out: WITCHCRAFT!! SORCERY!! Teasing aside, I don't get what's magical about this. It's a straightforward transform. You can call that "magic," I'll call it "syntax."

Sure it's straightforward enough and much better than what we had before. But for a newcomer to JSX it looks odd. I'm probably just missing the reason for the syntax, we're already compiling - why can't fragments be added automatically as required?

I'm guessing it's because JSX is XML-like and so parsers may require a single root element for each JSX "document". It's a good question though, hopefully someone from the React team might be able to comment.
Post reply on HN