GoKawiilWe’ll get to the asterisk.
I run Wirewiki.com, a website to inspect internet infrastructure like domain names. It helps people check (historic) DNS records, DNS delegation, email deliverability config, etc.
There are a ton of sites that offer this (growing faster than ever thanks to vibe coding), so I need a way to stand out. I picked tool quality / usefulness and UX.
The autocomplete is the main way to navigate Wirewiki, so it should be as complete, accurate and fast as possible. I want it to be instant. Like, next frame instant.
I've mostly achieved that. Try for yourself:
Here's how.
On keyDown (the user starts pressing a key), we prefetch the suggestions for the typed character + any next character. And on keyUp (the user releases the key), we render the suggestions.
GET /autocomplete?q=wi { "results" : [ "wikipedia.org" , "windowsupdate.com" , "windows.net" , "windows.com" , "wixsite.com" , "wikimedia.org" , "wiley.com" , "wildberries.ru" ], "next" : { "-" : [ "wi-fi.ru" , "wi-fi.org" , "wi-fi.click" , "wi-tribe.ph" , "wi-cat.ru" , "wi-fi.link" , "wi-power.com" , "wi-fi.com" ], "." : [ "wi.gov" , "wi.us" , "wi.infomart.co.jp" , "wi.net" , "wi.likebtn.com" , "wi.accountants" , "wi.agency" , "wi.amsterdam" ], "0" : [ "wi0.buzz" , "wi0.com" , "wi0.mobi" , "wi0.site" , "wi0.tech" , "wi0.top" , "wi0.xyz" , "wi00.com" ], … "9" : [ "wi9-h.com" , "wi9.casino" , "wi9.com" , "wi9.lol" , "wi9.mobi" , "wi9.org" , "wi9.top" , "wi9.xyz" ], "a" : [ "wiadomosci.wp.pl" , "wiadomosci.onet.pl" , "wiadomosci.gazeta.pl" , "wialon.com" , "wialon.host" , "wiair.com" , "wiara.pl" , "wiadomosci.radiozet.pl" ], … "k" : [ "wikipedia.org" , "wikimedia.org" , "wiktionary.org" , "wikihow.com" , "wikia.com" , "wikisource.org" , "wikibooks.org" , "wikidot.com" ], … "z" : [ "wizzair.com" , "wizards.com" , "wiz.world" , "wiz.biz" , "wiz.io" , "wiz.cn" , "wizardingworld.com" , "wizaz.pl" ] } }
That gives us a time budget of keyPress1Duration + gap between key presses + keyPress2Duration . If the API returns before the end of the second key press, we'll have the results ready in time.
(A 60 Hz display renders every 16.7 ms. So we technically have 8.33 ms extra time budget at p50, but near 0 ms at p99.)
... continue reading