Live data from Hacker News

What should go into JSX 2.0?

github.com

41–50 of 102 posts

Re: What should go into JSX 2.0?

#41
post #16

I like how the if proposal is down voted, probably because it's mentioning Angular. Conditional rendering in React is not always very clean. Most codebases end up resorting with something similar to this in a container to show a spinner while data is loading and rendering it when done. Problem is that the inner component will still be parsed and fail with cannot read property person of undefined. Yes, you can do this…

Loading (and error, etc) state should be the responsibility of the component doing the content rendering, not the parent. So the ConditionalSpinner component:

   
Could be written better as:

   
Where PersonRenderer would be defined as such:

   class PersonRenderer extends Component {
     render() {
       if(this.props.person) {
         return personcontent
       }
       return 
     }
   }
Given this, I'm still not sure how an If "component" would be achieved (and further, you'd need an Else or a Switch component anyway if going down this route). Maybe you could explain the benefits of such a path?

Re: What should go into JSX 2.0?

#42
post #2

JSX? Typescript? What are you a noob? That was so 2016. Come on, get with it - JSX 2.0, TypeScript 2.0, etc. is what real web devs use. That other crap is obsolete. This is 2017. Edit: I'm parodying this: https://hackernoon.com/how-it-feels-to-learn-javascript-in-2...

The parody would be fair enough with different technologies, but these are mere version-bumps. Backwards-compatibility may not be absolute, but generally speaking if you understand the use-case for v1, there's not going to be a lot of cognitive overload in figuring out v2.

Re: What should go into JSX 2.0?

#44
post #16

I like how the if proposal is down voted, probably because it's mentioning Angular. Conditional rendering in React is not always very clean. Most codebases end up resorting with something similar to this in a container to show a spinner while data is loading and rendering it when done. Problem is that the inner component will still be parsed and fail with cannot read property person of undefined. Yes, you can do this…

Loading (and error, etc) state should be the responsibility of the component doing the content rendering, not the parent. So the ConditionalSpinner component: Could be written better as: Where PersonRenderer would be defined as such: class PersonRenderer extends Component { render() { if(this.props.person) { return personcontent } return } } Given this, I'm still not sure how an If "component" would be achieved (and…

> Loading (and error, etc) state should be the responsibility of the component doing the content rendering

It's often divided in two: One container fetching the data, and a pure component rendering it.

Re: What should go into JSX 2.0?

#45
post #16

I like how the if proposal is down voted, probably because it's mentioning Angular. Conditional rendering in React is not always very clean. Most codebases end up resorting with something similar to this in a container to show a spinner while data is loading and rendering it when done. Problem is that the inner component will still be parsed and fail with cannot read property person of undefined. Yes, you can do this…

Loading (and error, etc) state should be the responsibility of the component doing the content rendering, not the parent. So the ConditionalSpinner component: Could be written better as: Where PersonRenderer would be defined as such: class PersonRenderer extends Component { render() { if(this.props.person) { return personcontent } return } } Given this, I'm still not sure how an If "component" would be achieved (and…

or create a wrapper function ...

  function withLoadingIndicator(Wrapped) {
    return function(props) {
      if (props.loading) {
        return ();
      }
      return ();
    }
  }

  // ...

  export class PersonRenderer extends Component {
    render() {
      return personcontent
    }
  }

  export default withLoadingIndicator(PersonRenderer);

Re: What should go into JSX 2.0?

#46

"What should go into JSX 2.0?" would be a much clearer title outside of the context of the GitHub issue.

Yup, even the issues not marked controversial seem so to me. I think JSX is quite nice but it has its limits/annoyances. One is obviously that it's not real HTML5. I would like to see a successor that is more like HTML5 without the X. No idea how that could be realized though... ;)

The best approach I've ever seen is Wicket, where you write pure HTML with just ID attributes, and all the logic / control flow is in the code. But the code for a component corresponds directly to the HTML (by having the same filenames), and each component can be very small and self-contained / compositional. It ends up being the best example of the good side of OO I've seen.

Re: What should go into JSX 2.0?

#47
post #7

I wish it could be possible to write this: const animal = "cat"; equivalent to:

IMHO This is way too insignificant benefit for a breaking change with this magnitude.

Using spread ( `{...{animal}}` ) is already working and it will stop working with the new syntax.

On top of that killing two brackets and three dots will not give you huge performance / code-productivity benefit.

Post reply on HN