JavaScript es un lenguaje de programación utilizado principalmente por los navegadores web para crear una experiencia dinámica para el usuario. La mayoría de las aplicaciones que hacen que Internet sea indispensable para la vida moderna están codificadas bajo esta plataforma. ¿Deseas conocer los trucos esenciales que recomienda Google Search Central (GSC) para optimizar JavaScript? Entonces sigue leyendo.
¿Cómo optimizar JavaScript según GSC?
Muchos desarrolladores conocen la importancia de optimizar JavaScript. De forma que hacerlo se convierte en una tarea permanente. Para ellos, un código optimizado es la combinación de lógicas programadas inteligentemente y pequeños trucos que logran un mejor rendimiento, mayor velocidad y un ahorro de tiempo. Conscientes de esto, Alan Kent y su equipo de e-commerce en Google entregan una serie de pasos que puedes aplicar en tu web:
1. Evita la proliferación de archivos para optimizar JavaScript
Como era de esperarse, desde Google se recomienda el uso de herramientas como PageSpeed Insights para detectar problemas. Estas buscarán mantener bajas las solicitudes de recuento de paquetes de datos; así como reducir los tamaños de transferencia de estos. Al respecto, se plantean dos estrategias:
- Por un lado, la compilación de archivos más pequeños para obtener un archivo único que pueda ser descargado.
- Por el otro, admitir HTTP/2 en una web. Esto suele mejorar sustancialmente el rendimiento, sin usar la técnica de unir archivos.
2. Limita las búsquedas de DNS
Un servidor DNS generalmente se refiere a un servidor de computadora. En él se encuentran alojados toda la base de datos de direcciones IP públicas y sus nombres de host asociados. A partir de ellos se deriva una problemática que se da al momento de la conexión con una página. En consecuencia, se ejecutan una variedad extrema de búsquedas de DNS para los datos reportados en registros de JavaScript de referencia. Algo que ocasiona que se ralentice la primera carga de un sitio web.
En este apartado se recomienda crear una copia con las secuencias de comandos con referencia externa a tu propio sitio web. De esta manera, lograrás optimizar JavaScript y reducir la cantidad de búsquedas de DNS.
3. Erradica JavaScript ineficiente
PageSpeed Insights está capacitado para detectar comportamientos anómalos, permitiendo a su vez optimizar JavaScript. Por ejemplo, revela los scripts que gastan CPU en exceso, al tiempo que corre el código JavaScript. También detecta los archivos que bloquean el renderizado de la página.
Para mejorar esta parte, deberás pensar en una asesoría experta que te permita reescribir el código. Así podrás producir tus propias versiones reducidas de componentes con base en este lenguaje.
4. Elimina JavaScript no utilizado
Cuando reutilizas el código en varios sitios, corres el riesgo de incluir JavaScript que no es necesario. En este apartado, Kent menciona cómo PageSpeed permite detectar JavaScript que no se ejecutó durante la carga de la página. Para mejorar en este aspecto, Google recomienda una técnica llamada “la sacudida del árbol”. A través de ella, se puede identificar JavaScript que no es llamado y que de seguro se puede eliminar.
5. Comprime archivos JavaScript
Este suele ser uno de los salvavidas más utilizados al momento de optimizar JavaScript. Es cierto: descomprimir el contenido del archivo requerirá más tiempo de CPU. Sin embargo, Google afirma que la compresión aporta beneficios a largo plazo. Si se configura correctamente, la mayoría de los sistemas de administración de contenido tendrán soporte incorporado para comprimir descargas.
6. Establece duraciones de caché para el código JavaScript
El éxito en este proceso radica en asegurar que tus archivos JavaScript tengan encabezados de tiempo de caducidad de caché. Como resultado, esto ahorrará la sobrecarga a los navegadores que determinan si los archivos JavaScript en tu caché están desactualizados. Algo que eventualmente mejora la productividad. Empleando PageSpeed e ingresando al menú titulado “Publica elementos estáticos con una política de caché eficaz”, podrás mejorar el tiempo de carga.
¿De qué otras maneras puedes optimizar JavaScript?
Una prueba dura te dará una idea clara de cuánto depende tu sitio web de JavaScript. Puedes verificarlo deshabilitándolo en tu navegador y viendo qué tan diferente se ve.
Ahora que eres consciente de su importancia, puedes ensayar una estrategia de carga de elementos por orden. Primero, es importante que todos los elementos en la sección <head> estén precargados, antes de que el visitante vea algo en el navegador. Luego, todos los elementos subsiguientes deberán ser ordenados para cargarse de manera lógica.
Cualquier JavaScript dentro de la sección <head> puede ralentizar la representación de tu página. Así que revisa si es estrictamente necesario contar con ellos en ese lugar. Finalmente, como descubrirás, existen numerosas tecnologías y técnicas para ayudarte a optimizar JavaScript. No es obligatorio usarlas todo el tiempo porque los casos y condiciones variarán. Sin embargo, al hacerlo verás excelentes resultados en el corto y mediano plazo.
