La key es un atributo que se debe pasar a todos los componentes creados dinámicamente a partir de un array. Es un identificador único y constante que React usa para identificar cada componente en el DOM y saber si se trata de un componente diferente o el mismo. Utilizando keys asegura que el componente secundario se conserve y no se cree nuevamente y evita que cosas extrañas sucedan.

La key no es realmente sobre el rendimiento, es más acerca de la identidad (que a su vez conduce a un mejor rendimiento). Aleatoriamente asignados y los valores cambiantes no forman una identidad Paul O’Shannessy

  • Utilice un valor único existente del objeto.
  • Definir las keys de los componentes padre, no en los componentes secundarios
//bad
...
render() {
	<div key={{item.key}}>{{item.name}}</div>
}
...

//good
<MyComponent key={{item.key}}/>

//bad
<MyComponent key={{Math.random()}}/>