Emoji tests

unicode

📫🥳🫣🤩

• ✅ the easiest solution
• ✅ doesn't rely on external system, but on standard
• ✅ can specify one emoji, only that gets loaded
• ❌ different systems render emojis differently
• ❌ Windows emojis look cheap

CDN

• ✅ can specify one emoji, only that gets loaded
• ✅ always looks the same
• ✅ cdn > local files
• ✅ won't have to care about updating
• ❌ two dependencies
  1. benborgers/emojicdn
  2. iamcal/emoji-data
• ❌ Might face cumulative layout shift

Local images

• ✅ can specify one emoji, only that gets loaded
• ✅ always looks the same
• ❌ have to either
  1. download all emojis (unnecessary)
  2. or download JIT, but then time gets wasted looking for sources / quality might differ
• ❌ Might face cumulative layout shift

My best guess:

1. Use CDN
2. Use emoji unicode as alt (alt will not be same size unless we use hacky css)
3. Create component
   1. [Required input]: Unicode
   2. [Optional input]: Size -> enum
   3. Renders emoji with unicode as fallback
   4. As emojis are always same (enum) sizes, -> reserve spacing to prevent cumulative layout shift during load times
   5. maybe use preloading