https://kotlinlang.org logo
#compose
Title
# compose
m

Miguel Coleto

08/28/2020, 7:14 AM
Do we have to place
mutableStateOf
always inside of
remember
? It is not clear to me what is
remember
doing 🤔
5 and 6
m

Miguel Coleto

08/28/2020, 7:28 AM
After reading this I'm still a little bit confused. I'll read it again more slowly
But do you know what is the equivalent for this construct in React?
Coming from 2017's React and little knowledge of React Hooks my understanding is that you would only need mutableStateOf
s

shikasd

08/28/2020, 7:37 AM
The important part here is that whole composable function is kinda like render in react, so it is re-evaluated every time some value has changed. That's why you would want remember, it will keep the value between those re-evaluations, so your state won't be lost.
You can imagine it as keeping the state outside of function (like a field in react component class), but you don't have to manage the instance of this component, you are just `remember`ing things
j

Javier

08/28/2020, 7:56 AM
I have no idea about react, sorry
m

Miguel Coleto

08/28/2020, 8:38 AM
So mutableStateOf should always be inside remember?
p

ppvi

08/28/2020, 8:42 AM
if you don't put it inside of a remember, you would be creating the MutableState on every composition
👍 2
m

Miguel Coleto

08/28/2020, 8:42 AM
Probably this has to do with the fact that Composable functions return Unit instead of being pure like in React right?
p

ppvi

08/28/2020, 8:44 AM
how so?
s

shikasd

08/28/2020, 8:47 AM
Being pure is the whole another topic I think. Hooks in react (useEffect and useState) are much closer to what remember is and they have quite similar reasoning behind them as well.
m

Miguel Coleto

08/28/2020, 8:51 AM
If composable functions were part of a class and they would return immutable copies of that class, you don't need to remember the state because you already have it as a field in the class
p

ppvi

08/28/2020, 8:52 AM
so... you're saying they're pure, which seems to contradict your question
m

Miguel Coleto

08/28/2020, 8:54 AM
I'm saying if they were
🙌 1
p

ppvi

08/28/2020, 8:54 AM
m

Miguel Coleto

08/28/2020, 9:03 AM
I think that I have some conflicts with this mental model coming from pure functional programming but I get it
Thanks for the resources guys 👍
👍 1
l

Leland Richardson [G]

08/28/2020, 2:44 PM
I talk about remember (and the fact that composable functions have a “memory”, which is what remember addresses) in my talk in a few places:

here

and

here

the equivalent in react is
useMemo
fwiw
useState is equivalent to the
state
function we used to have, which was simply a convenience method:
Copy code
@composable fun <T> state(init: () -> T) = remember { mutableStateOf(init()) }
if you are creating a state object inside of composition, you likely want to
remember
it or else when a recomposition happens it will just create a new one instead of using the old one (which is the whole idea behind `remember`… it “remembers” the previous value).
The neat thing about
mutableStateOf
is that you don’t need to call it in a composable function. If you are creating state somewhere else (say, in the construction of a class), you can create a state object there as well. This creates use cases that are similar to the new React library recoil if you are familiar with that (and also similar to mobx if you are familiar with that)
I also go into a lot of detail about how remember actually works in this talk

here

If you are familiar with recoil, here is a gist of recoil’s docs examples equivalent in compose: https://gist.github.com/lelandrichardson/4cfbb7aab96e01803cc7b289c2303e45
m

Miguel Coleto

08/28/2020, 7:08 PM
Amazing, thank you 👍
k

Karthick

08/28/2020, 7:09 PM
Why state does not remember itself other than remember { state }, we don't wrap state in memo in react 🤔
l

Leland Richardson [G]

08/28/2020, 7:22 PM
because in react, state is tied to the component itself
in compose it’s just an object
you can call
mutableStateOf
anywhere
k

Karthick

08/29/2020, 10:57 AM
So whenever we use the values of state object, composable functions will subscribe to it and whenever values changes it will recompose. Thank you