フロントエンドでUUIDはv4ではなくv7を使ったほうが良い

UUIDとは

UUID(Universally Unique Identifier)は一意性を持つ識別子です。

主にシステムのデータに一意のIDを付与するために使用されます。UUIDは非常に大きな範囲でIDを生成するため、重複する可能性が極めて低いです。

JavaScriptの場合はUUID v4であれば以下のコマンドで簡単に生成できます。

JavaScript
const uuid = crypto.randomUUID()
console.log(uuid)  // 例: 3b241101-e2bb-4255-8caf-4136c566a962

UUIDがv4ではなくv7のほうが良い理由

UUID v7は時間ベースで生成されるため、時間の経過に従って生成されたUUIDを検索やソートすることが容易です。

データベースやログの記録で「挿入順」や「生成順」に基づいてデータを処理したい場合が多いので、UUID v7のほうが有用です。

さらに、UUID v7は時間ベースであるため、常に新しいUUIDが最後に追加される傾向があります。これにより、データベースのインデックスの断片化が減り、パフォーマンスが向上することがあります。

JavaScriptでUUID v7を使う方法

UUID v7はv4のようにimportなしで生成することはできません。

JavaScript (TypeScript)でUUID v7を使う方法はいくつかありますが、npmでuuidv7をインポートして使うのがオススメです。

npm i -D ui7
TypeScript
import { uuidv7 } from 'uuidv7'

const id = uuidv7()
console.log(id)
// 例: 01926184-4316-7521-9e6a-22c69ab7d773

function convertUUID7toLocaleString(uuid: string): string {
  const parts = uuid.split('-')
  const bitsHex = parts[0] + parts[1].slice(0, 4)
  const timestamp = parseInt(bitsHex, 16)
  const date = new Date(timestamp)
  const dateLocaleString = date.toLocaleString()

  return dateLocaleString
}

console.log(convertUUID7toLocaleString(id))
// 例: 2024/10/6 20:08:30

UUID v7を日付に変換する関数を作成しておけば、UUIDから日付を簡単に生成できるので便利です。

前述の例ではdate.toLocaleString()を使用していますが、date.toISOString()にすればISO 8601形式にすることもできるので、覚えておくと良いでしょう。

TypeScript
const dateISOString = date.toISOString()
// 2024-10-06T11:08:30.870Z

UUID v7を使用すると第三者にも生成した日付がわかってしまうので、画面上に表示されて知られたくない場合はUUID v4を使用してください。