January 4, 2024
How to Easily Create a Random UID in JavaScript
Justin Golden
Length: Short
Level: ✓ Beginner ✓ Intermediate X Advanced
The Simple Solution
You can simply use window.crypto.randomUUID()
to get a random UID. It will output a string like 82aba12e-0c84-4ec0-aff0-fc66101dfb92
for example.
randomUUID
has 93% browser support at time of writing on caniuse.com.
You can make an alias like so:
const uid = () => window.crypto.randomUUID();
Then you can simply call uid()
instead of calling window.crypto.randomUUID()
.
Custom
If you want 100% browser support and to write your own solution, I’ve got a simple one line solution modified from this StackOverflow post (feel free to read the suggestions here for other ideas).
This code creates a base 36 (lowercase letters and numbers) ID, which uses both the current timestamp and random numbers. This would mean it’s both impossible to generate a duplicate ID unless timestamps are identical and if two timestamps are identical the odds of any two IDs being duplicate are 1/36^10. That’s 2.735e-16 or 0.000000000000000002735%.
Example output: lq783h2cp2cngzxuhtq
Code: Date.now().toString(36) + Math.random().toString(36).substring(2)
Full code in uid.js
:
const uid = () => Date.now().toString(36) + Math.random().toString(36).substring(2);
export default uid;
More Blog Articles