First Input Delay (FID) es una métrica que mide el tiempo entre el momento en que un usuario interactúa por primera vez con una página y el momento en que el navegador puede responder a esa interacción. Es considerado por Google como uno de los Core Web Vitals, uno de los factores esenciales para una buena experiencia de usuario en su sitio.
Debido a que se requiere la interacción real del usuario para medir el tiempo de respuesta, el FID no se puede simular en un entorno de prueba típico. Para ayudar a calcular el FID de su sitio, puede mirar el lado «Tiempo total de bloqueo» (TBT): no es lo mismo, pero en general, mejorar esta métrica ayuda a optimizar el FID. Page Speed Insight calcula el FID junto con otros Web Core Vitals
La principal razón de un mal FID es la ejecución de JavaScript. Por lo tanto, es necesario optimizar la forma en que se ejecuta su .js. También habrá que lidiar con scripts de terceros sobre los que no necesariamente tenemos toda la latitud necesaria para su optimización. ¿Eres usuario de WordPress? ¿Cuántas veces se le ha pedido que agregue un script al encabezado de su sitio? ¿Cuántos complementos lo hacen ellos mismos? Aquí estás. Lea también: 7 herramientas de Google para medir los Web Vitals de su sitio
Ejecución de JavaScript demasiado pesada
El navegador no puede responder al usuario mientras se ejecuta JavaScript en el hilo principal. Para mejorar esto, deberá reducir el tiempo de ejecución de JavaScript y separar las tareas que tardan demasiado en realizarse. Lea también: Las 15 mejores bibliotecas de JavaScript que debe probar
Reducir el tiempo de ejecución de JavaScript
Al limitar la cantidad de JavaScript en su página, reduce el tiempo que su navegador tiene para analizar, compilar y ejecutar su código JavaScript. Esto acelera la velocidad a la que el navegador puede comenzar a responder a cualquier interacción del usuario.
Para reducir la cantidad de JavaScript que se ejecuta en su página, puede:
Minimizar y comprimir archivos:
JavaScript puede contener caracteres que los navegadores no necesitan, pero que facilitan su lectura durante el desarrollo. Esto incluye espaciado, sangría, comentarios y nombres largos de variables.
Hay una gran cantidad de software para comprimir este código, limpiándolo de todo lo innecesario para el navegador: un archivo más pequeño = un tiempo de ejecución más corto.
Reenviar JavaScript no utilizado:
Por defecto, todo JavaScript está «bloqueando». Cuando el navegador encuentra una etiqueta de secuencia de comandos que apunta a un archivo externo, debe pausar lo que está haciendo y descargar, analizar, compilar y ejecutar ese JavaScript.
Por lo tanto, solo debe cargar el código necesario para la página o para responder a la entrada del usuario. A menos que haya una razón particular, todos los scripts de terceros deben cargarse en modo diferido o asíncrono de forma predeterminada:
Compruebe el orden de ejecución de los scripts de terceros.
La ejecución de un script de terceros también puede retrasar la latencia de la interacción. Muchos sitios incluyen secuencias de comandos de servicios de terceros que pueden ocupar el hilo principal y adormecerlo periódicamente. Intente cargar estos códigos de terceros a pedido (por ejemplo, no cargue anuncios en la mitad inferior de la página hasta que estén más cerca de la ventana gráfica). En algunos casos, las secuencias de comandos de terceros pueden tener prioridad y ocupar el ancho de banda en el hilo principal antes que las secuencias de comandos realmente útiles para los usuarios. También retrasa cuando una página está lista para la interacción. Intenta priorizar la carga de lo que creas que es más útil para los usuarios primero. Lea también: Web Vitals: ¿Cómo mejorar la mayor pintura con contenido (LCP)?
Separe las tareas que toman mucho tiempo en completarse.
La división de código es el concepto de dividir un solo JavaScript grande en partes más pequeñas, que se pueden cargar condicionalmente (también llamado «carga diferida»). Los navegadores más nuevos admiten la sintaxis de importación dinámica, lo que le permite recuperar formularios a pedido.
Las tareas largas son tiempos de ejecución de JavaScript superiores a 50 ms, durante los cuales los usuarios pueden encontrar que la interfaz de usuario no responde.
Esta es una señal de que el código probablemente se está cargando y ejecutando más de lo que un usuario necesita en este momento. Lea también: FLUYEZCAMBIOS: 10 consejos para mejorar los tiempos de carga de su sitio
Conclusión
La forma más sencilla de evitar que JavaScript aumente el tiempo de reacción de una página es asegurarse de mantener la menor cantidad posible de scripts en el encabezado de su sitio web, lo que retrasa todo lo que carga el visitante.
Debe evaluar todos los scripts agregados al encabezado de su sitio web.
Si es un usuario de WordPress, debe monitorear todos los complementos utilizados, que son intensivos en Javascript. Vale la pena mirar el código fuente de su sitio web y la lista de complementos para ver si alguno de ellos se puede deshabilitar, diferir, minimizar e incluso activar solo en las páginas donde realmente se necesitan. Advertencia: ¡todas estas manipulaciones pueden resultar técnicas! Contrate a un experto en JavaScript para mejorar su FID de forma segura. Publique su proyecto hoy en FLUYEZCAMBIOS.pe y obtenga cotizaciones de muchos desarrolladores independientes.
Relacionados
Hola! Soy Juan Manuel Fluyez, mas conocido como «Fluyez» entre los SEOS, socio co-fundador de FLUYEZCAMBIOS S.A
Mi amigo Luis Alberto Cambios y yo fundamos FLUYEZCAMBIOS en 2013 en Lima, Perú. Desde entonces lideramos el grandísimo equipo que esta detrás de FLUYEZCAMBIOS.pe
Estamos aquí para revelar toda la información necesaria sobre el concurso SEO de FLUYEZCAMBIOS!
