4 ms·

The article has a section that addresses exactly this point: https://reactjs.org/docs/concurrent-mode-suspense.html#race-conditions-with-componentdidupdate http

The article has a section that addresses exactly this point: https://reactjs.org/docs/concurrent-mode-suspense.html#race-conditions-with-componentdidupdate https://reactjs.org/docs/concurrent-mode-suspense.html#race-... Hope this is helpful.

manigandham 7y ago
The issue is that the lifecycle methods themselves aren't async right? Async is viral so it would have to be throughout the library, which was my point about it being bolted on instead of the starting point. Wouldn't making the lifecycle methods async not fix this?
- danabramov 7y ago
  I don't know what "making the lifecycle methods async" means. What are the concrete semantics you are proposing?
  - manigandham 7y ago
    I guess I would have to dig in further into the runtime but is there a reason why methods like `componentDidMount` can't be async themselves? If the entire runtime was async then wouldn't that naturally allow any other user/component level async calls to naturally work as expected?
    - danabramov 7y ago
      What would it mean to "make them async"? You're kind of hand waving the gnarly details from which everything else follows. In some way, Suspense is "making them async" btw. Or, rather, making render async. So maybe we're talking about the same thing.
      - manigandham 7y ago
        I'm unsure how to explain so I'll use an example: when C# released async/await, a common complaint was that async functions could only be called if the parent/calling function is also made async, which meant any of its parent functions also had to become async, and so on. It spreads virally until the entire entrypoint for the program had to be async too. If the React runtime was completely async (as in returning promises for every function) from the `ReactDom.Render()` to the lifecycle methods to render(), then user code can transparently support any `await fetchSomeData()` calls. Basically change every method from: f(x) => T; into: async f(x) => Promise<T>; I believe the major change would be the runtime checking if the render() promise was resolved or not, and skipping the component if it wasn't. Am I completely off base here?
        danabramov 7y ago
        It’s a bit more complex than that... Just making everything async doesn’t solve hard problems like how does your app stays interactive while waiting for something. Ironically that is what Concurrent Mode is all about. So in a way, yes, what you describe is more or less what we did. Seems like we’re talking about the same thing.

manigandham 7y ago

The issue is that the lifecycle methods themselves aren't async right? Async is viral so it would have to be throughout the library, which was my point about it being bolted on instead of the starting point. Wouldn't making the lifecycle methods async not fix this?

danabramov 7y ago
I don't know what "making the lifecycle methods async" means. What are the concrete semantics you are proposing?
- manigandham 7y ago
  I guess I would have to dig in further into the runtime but is there a reason why methods like `componentDidMount` can't be async themselves? If the entire runtime was async then wouldn't that naturally allow any other user/component level async calls to naturally work as expected?
  - danabramov 7y ago
    What would it mean to "make them async"? You're kind of hand waving the gnarly details from which everything else follows. In some way, Suspense is "making them async" btw. Or, rather, making render async. So maybe we're talking about the same thing.
    - manigandham 7y ago
      I'm unsure how to explain so I'll use an example: when C# released async/await, a common complaint was that async functions could only be called if the parent/calling function is also made async, which meant any of its parent functions also had to become async, and so on. It spreads virally until the entire entrypoint for the program had to be async too. If the React runtime was completely async (as in returning promises for every function) from the `ReactDom.Render()` to the lifecycle methods to render(), then user code can transparently support any `await fetchSomeData()` calls. Basically change every method from: f(x) => T; into: async f(x) => Promise<T>; I believe the major change would be the runtime checking if the render() promise was resolved or not, and skipping the component if it wasn't. Am I completely off base here?
      - danabramov 7y ago
        It’s a bit more complex than that... Just making everything async doesn’t solve hard problems like how does your app stays interactive while waiting for something. Ironically that is what Concurrent Mode is all about. So in a way, yes, what you describe is more or less what we did. Seems like we’re talking about the same thing.