andreypopp / react-derivable

React bindings for derivable state computation library
123 stars 5 forks source link

React bindings vs vanilla js - multiple derivations' recalculation #3

Open mostr opened 7 years ago

mostr commented 7 years ago

Hey,

I'm playing with derivablejs and wanted to use it with your react bindings but I'm having one issue that I cannot understand. I've created simple project to better illustrate stuff https://github.com/mostr/derivablejs-react-vanilla-sandbox

Scenario There is a mailbox that is empty on start. By clicking a button you can load emails and then once loaded you can click single email to mark it as read. Emails are loaded as "map" keyed by their id. To render them it's better to have them as list, that's why there is derivation emailsAsList that is used to render stuff.

Problem

React version seems to be calling derivations' calculation multiple times even if nothing was really changed in the meantime (so as I understand, previous value should be reused). This is not the case with vanilla JS implementation, where calculations are only called once (when required).

There is console.log statement in derivation calculation function that allows observing when it gets called.

Question Is there something I don't get in how react bindings work here or I do something wrong? Would be great if you could advise me on that a bit. Thank!

andreypopp commented 7 years ago

Yeah, derivable as for now doesn't cache values always (when there's no subscription) and react-derivable is implemented in a way which does re-subscription...

Thanks for reporting that. I'll see what I can do with that.

oskbor commented 7 years ago

Has this been solved with the 1.0 version of derivable?

oskbor commented 7 years ago

Or rather the latest 1.0 beta..