Keys para listas estables y rápidas
Ayude a Compose a seguir los elementos cuando cambian.
Keys para listas estables y rápidas es una lección gratuita de Jetpack Compose Academy en CoddyKit. Esta es la lección 3 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Jetpack Compose Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Jetpack Compose Academy incluye 4 lecciones en total.
Partes de esta lección aún no han sido traducidas y se muestran en inglés.
How Compose Tracks Rows
By default, Compose identifies each row by its position in the list. Item zero is item zero, item one is item one, and so on.
Position Breaks on Change
When you insert or remove a row, every item below shifts position. Compose now thinks those rows are different and rebuilds them needlessly.
The Cost of Confusion
Rebuilt rows lose their state and animations. A removed item can make the whole list flicker as Compose reshuffles everything below it.
Give Each Item a Key
A key is a stable, unique value that names each item by identity, not position. Then Compose follows items even as they move.
items(users, key = { it.id }) { user ->
Text(user.name)
}Use a Real Unique ID
The best key is a true unique id from your data, like a database id. It stays the same no matter where the item sits.
Keys Must Be Unique
Every key in the list must be different. Duplicate keys throw a runtime error, so never key items by a value two rows might share.
Don't Key by Index
Using the index as a key defeats the purpose, since indexes shift just like position. Reach for it only when you truly have no id.
State Stays With the Item
With stable keys, a row's remembered state travels with it. A checkbox stays checked even after items above it are deleted.
Keys Power Animations
Stable keys let Compose animate items moving, appearing, or leaving. Without them, it can't tell a move from a rebuild.
items(items, key = { it.id }) { item ->
Text(item.label, Modifier.animateItem())
}itemsIndexed Takes Keys Too
The itemsIndexed builder also accepts a key lambda. You still get the index, plus stable identity for every row.
itemsIndexed(data, key = { _, item -> item.id }) { i, item ->
Text("$i: ${item.name}")
}Keys Are Almost Always Worth It
For any list that can change, adding keys is a tiny effort with a big payoff: correct state, smooth animations, and fewer rebuilds.
Quick Check
What makes a good list key?
Recap: Stable Keys, Stable Lists
Keys give items identity beyond position. Use a real unique id, keep keys unique, and your state and animations just work. ✨
Aprende Kotlin con un tutor de IA — gratis
Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.
- Cursos
- 30
- Lecciones
- 120
Preguntas frecuentes
¿La lección «Keys para listas estables y rápidas» es gratis?
Sí — el texto completo de «Keys para listas estables y rápidas» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Jetpack Compose Academy, actualiza a CoddyKit PRO. El curso de Jetpack Compose Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Keys para listas estables y rápidas»?
Ayude a Compose a seguir los elementos cuando cambian. Practicas Jetpack Compose Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Jetpack Compose Academy?
No se requiere experiencia previa. Jetpack Compose Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 3 de 4.
¿Cuánto tiempo toma la lección «Keys para listas estables y rápidas»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Jetpack Compose Academy?
Sí. Cada lección de Jetpack Compose Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- LazyColumn frente a Column desplazable
- items e itemsIndexed
- Keys para listas estables y rápidas
- Encabezados fijos y listas por secciones