React: dada uma matriz, processe os elementos na ordem inversa de forma eficiente

Atualmente, renderizo uma lista no estilo típico do React. A lista é passada como um suporte de matriz e eu mapeio sobre ela da seguinte maneira:

{this.props.myList.map(createListItem, this)}

Portanto, quando um novo elemento é adicionado, parece que o item mais recente foi adicionado ao final da lista.

Gostaria que o item mais recente fosse exibido no topo. isto é, tudo aparece em ordem cronológica inversa.

As duas opções apresentadas até agora são: 1) Inverta a lista, criando uma nova matriz sempre que algo for adicionado e passe essa lista invertida como prop. 2) Use turno.

Mas ambos não são atraentes por causa do desempenho.

Não tenho conhecimento do Javascript que suporta o mapeamento na ordem inversa. Eu tenho tentado um loop for, mas não consegui fazê-lo funcionar.

Qual é a maneira idiomática de renderizar uma matriz em ordem inversa no React?

questionAnswers(4)

yourAnswerToTheQuestion