Administro Wirewiki.com, un sitio para inspeccionar infraestructura de internet como nombres de dominio. Ayuda a las personas a verificar registros DNS (históricos), delegación DNS, configuración de entrega de correo electrónico, etc. Hay muchos sitios que ofrecen esto (creciendo más rápido que nunca gracias al vibe coding), así que necesito una forma de destacar. Elegí la calidad / utilidad de la herramienta y la UX.

El autocompletado es la principal forma de navegar por Wirewiki, por lo que debe ser lo más completo, preciso y rápido posible. Quiero que sea instantáneo. Como, instantáneo en el siguiente cuadro.

Lo he logrado en su mayoría. Al presionar una tecla (el usuario comienza a presionar una tecla), obtenemos con antelación las sugerencias para el carácter escrito + cualquier carácter siguiente. Y al soltar la tecla (el usuario suelta la tecla), renderizamos las sugerencias.

Esto nos da un presupuesto de tiempo de la duración de la pulsación1 + la brecha entre pulsaciones + la duración de la pulsación2. Si la API devuelve antes de que termine la segunda pulsación, tendremos los resultados listos a tiempo. (Una pantalla de 60 Hz renderiza cada 16.7 ms. Así que técnicamente tenemos un presupuesto de tiempo adicional de 8.33 ms en p50, pero cerca de 0 ms en p99.) Tecla soltada Tecla presionada wik GET /autocomplete?q=wi Renderizar completaciones para 'wik' Presupuesto de tiempo de la API Tiempo de ida y vuelta de la API La solicitud para q=wi se dispara en el instante en que se presiona i; si su respuesta llega antes de que se suelte k, las completaciones para wik se renderizan con cero latencia percibida.

Así que, para el propósito de este artículo, definiremos la latencia como de soltar la tecla a los resultados listos para renderizar. p99 0 ms significa que el 99% de las veces, los resultados estarán listos antes de que el usuario suelte la tecla. Necesitamos dos cosas para que esto suceda: Precarga y almacenamiento en caché de las sugerencias del lado del cliente, y Una API lo suficientemente rápida. ¿Qué tan grande es el presupuesto? Ahora sabemos que podemos gastar dos duraciones de pulsación de tecla y una duración de brecha, pero ¿cuánto es eso en milisegundos? Lo he medido mientras escribía 100 nombres de dominio razonablemente rápido y he encontrado que p99 funciona para mí en 121 ms.