El inicio de Herramientas para desarrolladores ahora es un 13% más rápido 🎉 (de 11.2 s a 10 s)
TL;DR: El resultado se logra quitando una serialización redundante.
Descripción general
Mientras se inicia Herramientas para desarrolladores, es necesario realizar algunas llamadas al motor de JavaScript V8.
El mecanismo que usa Chromium para enviar comandos de Herramientas para desarrolladores a V8 (y para IPC en general) se llama mojo. Mis compañeros de equipo, Benedikt Meurer y Sigurd Schneider descubrieron una ineficiencia mientras trabajaban en otra tarea, y se les ocurrió una idea para mejorar el proceso eliminando dos pasos redundantes en la forma en que se envían y reciben estos mensajes.
Veamos cómo funciona el mecanismo mojo.
Los mecanismos mojo
Hay un comando mojo EvaluateScript que ejecuta el comando JS. Serializa todo el comando JS, incluido el arguments, en una cadena de código fuente de JavaScript que puede ser eval(). Como puedes imaginar, estas cadenas pueden volverse bastante largas y costosas. Una vez que V8 recibe el comando, estas cadenas de código JavaScript se deserializan antes de ejecutarse. Este proceso de serialización y deserialización para cada mensaje crea una sobrecarga significativa.
Benedikt Meurer notó que la serialización y deserialización de arguments son bastante costosas y que todos los pasos "Serialize JS command to JS string" y "Deserialize JS string" son redundantes y se pueden omitir.
Detalles técnicos: RenderFrameHostImpl::ExecuteJavaScript
Cómo mejoramos
Presentamos otro método de la API de mojo que nos permite pasar el nombre del objeto, el método al que se llamará y la lista de argumentos directamente, en lugar de tener que crear la cadena del código fuente de JavaScript. Esto nos permite omitir la serialización y deserialización, y quita la necesidad de analizar el código JavaScript.
Para obtener detalles técnicos sobre cómo implementamos esta optimización, consulta estos dos parches:
- CL 2431864: [devtools] Reduce la sobrecarga de rendimiento del envío de mensajes en el frontend
- CL 2442012: [Herramientas para desarrolladores] Usa
ExecuteJavaScriptMethoden Herramientas para desarrolladores
Impacto
Para medir la eficacia del cambio, ejecutamos algunas mediciones que comparan las revisiones de Chromium cb971089a058 y 4f213b39d581 (antes y después del cambio).
Para ambas revisiones, ejecutamos la siguiente situación 5 veces:
- Registrar seguimiento con
chrome://tracing - Cómo abrir Herramientas para desarrolladores en Herramientas para desarrolladores
- Obtén el registro
CrRendererMainregistrado y compara las métricas específicas de V8.
En función de estos experimentos, Herramientas para desarrolladores se abre ~13% más rápido (de 11.2 s a 10 s) con la optimización.
Aspectos destacados y duraciones de la CPU
| Nombre del método | Sin optimizar (ms) | Optimizado (ms) | Diferencias (ms) | Mejora de la velocidad (%) |
| Total | 11,213.19 | 9,953.99 | −1,259.20 | El 12.65% |
| v8.run | 499,67 | 3.61 | −496.06 | 12,65% |
| V8.Execute | 1,654.87 | 1.349.61 | −305.25 | 3,07% |
| v8.callFunction | 1,171.84 | 1,339.77 | 167.94 | −1.69% |
| v8.compile | 133,93 | 3.56 | −130.37 | 1,31% |
Tabla de comparación completa de métricas de seguimiento
Como resultado, se abre Herramientas para desarrolladores y funciona más rápido con menos uso de CPU. 🎉
Descarga los canales de vista previa
Considera usar Chrome Canary, Dev o Beta como navegadores de desarrollo predeterminados. Estos canales de vista previa te brindan acceso a las funciones más recientes de Herramientas para desarrolladores, prueban API de plataforma web de vanguardia y detectan problemas en tu sitio antes que los usuarios.
Comunicarse con el equipo de Herramientas para desarrolladores de Chrome
Usa las siguientes opciones para hablar sobre las nuevas funciones y los cambios en la publicación, o cualquier otra cosa relacionada con Herramientas para desarrolladores.
- Para enviarnos sugerencias o comentarios, accede a crbug.com.
- Para informar un problema de Herramientas para desarrolladores, use Más opciones
> Ayuda > Informar problemas de Herramientas para desarrolladores en Herramientas para desarrolladores. - Twittea a @ChromeDevTools.
- Deja comentarios en nuestros videos de YouTube de Herramientas para desarrolladores o en videos de YouTube de las Sugerencias de las Herramientas para desarrolladores.