Thank you for the compliment! I did spend a lot of time designing a nice experience on both desktop and mobile. Even the scrollbar to select words was non trivial as I wanted the words to be of different size, yet avoid flickering when scrolling!
I was focused on the data initially scrolling through until I suddenly realised, wow, this is really nice!
One very minor note: if your scroll device reports pixel-perfect deltas rather than discrete scroll-wheel ticks (e.g. logitech mx master, laptop touchpad, etc), the behaviour in the word search box is a bit weird. Arrow keys work fine though.
I did test it with my mac touchpad without issue. Maybe the problem is that I wanted to make discrete scroll-wheel ticks work. I just tried a fix by normalising deltaMode to pixels.
If you could just paste this in your console, I would have a better idea:
document.querySelector('.wall').addEventListener('wheel', e =>
console.log(e.deltaMode, e.deltaY.toFixed(2), e.defaultPrevented ? 'PAGE' : 'native'), true)Hyperscroll - special mode turned on with a button next to scroll that turns off scroll friction and let's you scroll into infinity (wheel keeps turning after you lift your finger).
> Arthur Conan Doyle, The Lost World
Basically when scrolling, the frame around words will have a stable top edge to avoid flickering, and it took me a few iterations to make it work.
I tested multiple designs, some of them inspired by word clouds and the size variation stuck afterwards.