Async actions batch (transactions)

[nbabanov]

Hello everyone! I need some help. I've read the https://mobx.js.org/actions.html#asynchronous-actions page, but it does not show a similar case like mine.

What is happening?
I have an action which triggers a couple of other actions, which are all async and modify the state at different times. This results in multiple observer notification instead of only one after all changes have been done.

Why is this a problem?
My UI is rerendered a lot of times due to the state being updated piece by piece. This creates visual glitches and makes the UX subpar.

What is the ideal solution?
I need to batch some async actions, but I don't see a way to do this. Look at the code below. I want to update the MobX state / Notify the observers only after asyncAction has resolved.

const obj = {
  asyncAction = mobx.action(async () => {
    await functionThatChangesStateAfterResult();
    await anotherFunctionThatChangesStateAfterResult();
  });
}

After looking at the MobX internals I see that executeAction does not wait for the function to complete (if it's async) and synchronously calls _endAction. I want to have a transaction that wraps all async actions and then notifies the observers.

Thank you for your time!

[urugator]

There is nothing like async transaction. Create a local temporal object/variable that is modified by the individual async tasks and write the result to actual observables at the end of async flow.

[nbabanov]

Thank you, I haven't thought about this! I'll go this way.

[mweststrate]

Or capture the writes in a thunk to postpone them and run them at the end.

…

On Wed, 13 Oct 2021, 19:09 urugator, ***@***.***> wrote: There is nothing like async transaction. Create a local temporal object that is modified by the individual async tasks and write the result to actual observables at the end of async flow. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#3144 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAN4NBC4NYQP2ZEIGDNABHDUGXDL5ANCNFSM5F5EC27A> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>.

[nbabanov]

Thank you! In essence your answer is the same as @urugator . I'll see how I'll implement it, because it would be a change to a numerous places in one of our core APIs.