La diferencia entre derivadaStateOf{} y Remember{} con claves en Android Jetpack Compose
En este breve artículo, explicaré claramente la diferencia entre derivedStateOf{}usar y usar claves . remember{}Después de leer este artículo, tendrás una idea muy clara de la diferencia entre ellos.
requisitos previos
Para comprender este artículo, debe estar familiarizado con los siguientes conceptos:
-
Crear y recordar estado en Redactar
-
La relación entre estado y recombinación
-
Reagruparse
recordar{} con claves
remember{}Las funciones se utilizan para recordar el estado en la composición. Esto ayuda a que las funciones componibles recuerden valores anteriores al recomponer. rememberLas funciones también pueden tomar algunos parámetros, llamados "claves". Las claves pueden ser cualquier valor que cambie con el tiempo. La función puede tomar múltiples claves como argumentos. En Compose, usamos state para representar valores que pueden cambiar con el tiempo. Cuando cambia el valor de cualquiera de las claves pasadas al bloque de memoria, rememberse volverá a ejecutar la lambda final del bloque. Esto es útil si necesita recordar el estado y solo volver a calcular cuando cambia otro estado.
Por ejemplo, suponga que desea filtrar una lista cuando el usuario cambia el filtro. Puede crear un bloque de recuerdo que utilice el filtro seleccionado actualmente como clave. La lista de filtros solo se vuelve a calcular cuando cambia el filtro seleccionado actualmente.
val filteredTasksByName by remember(currentlySelectedFilter) {
tasks.filter{
it.name == currentlySelectedFilter.filterName }
}
estadoderivadode
Aunque a primera vista derivedStateOfpueda parecer una versión mejorada rememberde , se utiliza principalmente para realizar otra función importante. Si bien derivedStateOf la expresión lambda final para se vuelve a evaluar cada vez que cambia cualquier valor de estado al que hace referencia, esto elimina la necesidad de especificar explícitamente la clave.
@Composable
fun someComposableFunction(){
.
.
.
var stateVariable by remember {
derivedStateOf {
// any state that is read within this block will cause
// this block to be re-executed when that state changes value.
}
}
.
.
.
}
Como se mencionó anteriormente, se utiliza para realizar otra función importante: reducir la reagrupación innecesaria. En caso de recordar, la lambda volverá a calcular incluso si la clave cambiada se establece en el mismo valor que se estableció anteriormente. Voy a usar el ejemplo que usé en otro artículo, que se cubre en detalle derivedStateOf. Si desea derivedStateOfuna guía detallada sobre qué es y cuándo debe usarlo, consulte ese artículo. Digamos que queremos mostrar un FAB (botón de acción flotante) de "desplazarse hacia arriba" cuando el usuario se desplaza más allá del tercer elemento en la lista perezosa. Si usamos remember {}, probablemente así.
@Composable
fun someComposableFunction(){
.
.
var isScrollUpFabVisible = remember(lazyListState.firstVisibleItemIndex){
lazyListState.firstVisibleItemIndex > 3
}
.
.
if(IsScrollUpFabVisible){
/* Display the floating action button*/
}
.
.
}
Esta implementación, mientras funciona, provoca una gran cantidad de recomposición innecesaria. lazyListState.firstVisibleItemIndexLas propiedades cambian con mucha frecuencia. Esto tiene sentido porque a medida que el usuario se desplaza por la lista, cambia el índice del primer elemento visible. ¡Esto hace que las funciones componibles se recombinen a medida que el usuario sigue desplazándose! Si pensamos en los cambios de estado como una serie de flujos de datos, obtenemos algo como esto: falso, falso, falso, falso, verdadero, verdadero, verdadero... y así sucesivamente. Sería mejor recombinar al mover el estado de verdadero a falso y viceversa, que es exactamente derivedStateOflo que se hace . Mira el nuevo valor y lo compara con el valor anterior. Si ambos son iguales, el valor del estado no cambiará. Dado que el valor del estado no ha cambiado, las funciones componibles que leen ese estado no se recompondrán. Por lo tanto, se reduce la recombinación innecesaria. Esta es la derivedStateOf característica y debe usarse cuando las funciones componibles que usan el estado necesitan cambiar con menos frecuencia que el estado. La misma funcionalidad se puede lograr de manera más eficiente con el siguiente código:
@Composable
fun someComposableFunction(){
.
.
var isScrollUpFabVisible by remember {
derivedStateOf {
lazyListState.firstVisibleItemIndex > 3}
}
.
.
if(IsScrollUpFabVisible){
/* Display the floating action button*/
}
.
.
}
en conclusión
Este artículo derivedStateOf explica rememberla diferencia entre y con valores-clave. Si bien ambos realizan funciones similares, se utilizan derivedStateOfprincipalmente para reducir la reorganización innecesaria, remember mientras que se utilizan para recordar el estado. Debe usarse cuando la tasa de cambio de estado es mayor que la tasa de reorganización de la función compuesta derivedStateOf. Recuerde, remember es una función de composición, derivedStateOfno una función normal de Kotlin. Espero que pueda entender la diferencia entre estas dos funciones y usarlas de manera flexible en la programación.