Using web worker inside redux selector

Question

I have a state which contains some data, that I currently compute synchronously in a selector using reselect library.

Since this is heavy computation, I thought about doing it in a web worker. Problem is the selector will then return an asynchronous result

Do you know how do handle this ?

The best solution would be that once the worker has finished the job, to somehow return the value to the component and cache the result in the selector. But I am puzzled as to how to call the component asynchronously using mapStateToProps (without modifying the global state in the store)

Any idea ? Thanks,

Answer 1

A decent approach would probably be to instead do the calculation in an asynchronous action and store the calculation result in the state.

This way you don't block the main thread, you can keep rendering the application with a placeholder for the result, and insert the result once the calculation is finished.

This approach would in some ways be comparable to how you would approach triggering an API call, which is indeed not that much different from React's perspective to what you are trying to achieve.