Reactにおける新しいidの問題

データベースから以下のオブジェクト配列が渡されたとします：

const prods = [
	{id: 1, name: 'product1', cost: 100},
	{id: 2, name: 'product2', cost: 200},
	{id: 3, name: 'product3', cost: 300},
];

ご覧の通り、idは順番に番号が振られています。しかし、番号に抜けがある可能性があることを考慮する必要があります。例えば、3番目の後に 5番目や6番目が直接来るかもしれません。このため、クライアント側のスクリプトは次の idが何になるかを知ることができません（この場合、必ずしも4とは限りません）。

新しいidはサーバーのデータベースによって作成されます。これはクライアント側での作業においていくつかの問題を引き起こす可能性があります。要点は以下の通りです：フォームを使用して配列に新しい要素を追加したと想定します。しかし、フォームからのデータを単純に追加することはできません。なぜなら、新しい要素のidが何になるか分からないからです！

次に来るべきidをサーバーから取得するためにリクエストを送信し、その後で初めてオブジェクト配列に要素を追加する必要があります。これにより、画面上でのデータ表示に遅延が発生します：データがサーバーに送信され、サーバーからデータが返送されるまで、ある程度の時間が経過します。