Twemoji Explorer

Twemoji Explorer is a website I created to improve my Twemoji usage workflow. Sometimes, while building websites, I want to sprinkle in some personality with Twemojis, my preferred emoji set. This site allows me to easily browse, copy, and use Twitter’s Twemoji.

From this project, I also wrote up blog posts about searching large datasets such as a list of emojis, as well as improving mobile and keyboard usability.

Stack

The site was created with Elder.js and Svelte. Like with most of my projects, I try to use technologies that I haven’t used before. I’ve been wanting to try out Elder.js because of their build performance claims, and while this project is literally a single page, I still wanted to familiarize myself with Elder’s structure. I was also considering using Elder for another project, so I wanted to try it out.

Svelte was a great choice for this project since Svelte makes it super easy to build performant web applications, with minimal code. Even though this project isn’t too complicated, it would’ve been a pain using vanilla JS.

Challenges

The biggest challenge with this project was the emoji search. I wanted it to be as close to real-time as possible, but there are also like two thousand different emoji, so this was a bit of a challenge. In fact, I wrote up a blog post about everything I tried and what I ended up doing.

Essentially, with a combination of a performant search library, hiding extra emojis behind a button, and debouncing the input, the search functionality now feels pretty good. These techniques also helped me improve the search for Duosmium Results.