NanoID is an alternative to [[UUID]]s. It's an [[Coding Package Manager|NPM]] package, but available also for other languages. It's used in the cloud provider CloudScale.
They are [[URI]]-friendly. You can also specify your alphabet - for example to avoid [[Unambiguous Characters]]. Their length can be changed to suit the frequency/size of the pool they need to be generated for. The code to generate them is crazy simple, even if you don't import the NPM package you could pretty easily re-implement the functions.
Full code from [CDN](https://cdn.jsdelivr.net/npm/nanoid/+esm):
```javascript
let a="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";export let nanoid=(e=21)=>{let t="",r=crypto.getRandomValues(new Uint8Array(e));for(let n=0;n<e;n++)t+=a[63&r[n]];return t};
```
Small working HTML page:
```HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Generate Nanoid</title>
</head>
<body>
<h1>Nanoid Generator</h1>
<p>Click the button to generate a new nanoid.</p>
<button id="generate-button">Generate Nanoid</button>
<p id="nanoid-display"></p>
<script type="module">
import * as nanoid from 'https://esm.run/nanoid';
const generateButton = document.getElementById('generate-button');
const nanoidDisplay = document.getElementById('nanoid-display');
//customizing alphabet & default length, just cause - this one is good for 1B records at 1% collision
const myNanoIdConfig = nanoid.customAlphabet('346789ABCDEFGHJKLMNPQRTUVWXYabcdefghijkmnpqrtwxyz', 12)
generateButton.addEventListener('click', () => {
const newNanoid = myNanoIdConfig();
nanoidDisplay.textContent = `Generated Nanoid: ${newNanoid}`;
});
</script>
</body>
</html>
```
****
# More
## Source
- https://youtu.be/a-K2C3sf1_Q?si=LF90osa3DcS72DnW
- Gemini bootstrapped the example code, I had to fix it
## Related