Cómo mejorar el rendimiento del sitio: ganancias rápidas de auditoría de 4 velocidades

Todos sabemos que la velocidad es dinero.

Un sitio más rápido convierte mejor y conduce a mejores ingresos.

A pesar del impacto directo de la velocidad en el resultado final, obtener recomendaciones para implementar mejoras de rendimiento a veces puede ser un desafío, ya que a menudo implica la edición de código heredado que podría afectar la integridad estructural del sitio.

Esto es especialmente cierto cuando se trata de mejorar el rendimiento de JavaScript.

Si bien la flexibilidad de JavaScript hace que sea fácil de usar cuando se codifican funciones, esa misma flexibilidad (al ser un lenguaje dinámico y poco escrito) lo hace más difícil de mantener.

Como todos sabemos un sitio anti spyware es transmitir confianza.

Una de las solicitudes que suelen realizar tanto los clientes como los desarrolladores es priorizar las mejoras de rendimiento según la facilidad y los recursos necesarios (debido a las limitaciones en el tiempo de desarrollo).

Esto puede ser bastante difícil de determinar, especialmente si no es un desarrollador y no tiene una vista completa del código de back-end del sitio.

Lo soluciono ordenando mi lista de acuerdo con las actividades que entiendo que requerirán ediciones mínimas en el código del sitio.

 

1. Eliminación de herramientas, widgets y tecnología web de terceros

La mayoría de los sitios web dependen de tecnología de terceros para el seguimiento, la supervisión, la atención al cliente (funciones de chat) y mucho más.

El desafío con la tecnología de terceros es que generalmente se ejecuta en su sitio utilizando un código sobre el que usted no tiene control y, por lo tanto, no puede mejorar su rendimiento.

La cantidad de secuencias de comandos de terceros que se cargan en una página puede ralentizar el rendimiento de la página porque las secuencias de comandos son de dominios diferentes.

Para comprender esto, primero debe comprender lo que sucede al acceder a una página web.

Al acceder a una página web, el navegador encuentra todos los recursos que requieren una búsqueda de DNS (Sistema de nombres de dominio).

El navegador debe esperar hasta que se complete la búsqueda antes de comenzar a descargar la página.

Este evento depende de que el servidor de origen responda rápidamente.

Cuando el servidor responde, el navegador debe leer y comprender el código y luego se lo debe entregar.

Aunque este evento puede tardar milisegundos, multiplique eso por las búsquedas que tiene que hacer el navegador y luego incluya un tiempo de respuesta lento del servidor de cualquiera de los dominios que se buscan, esos milisegundos aumentan a segundos.

La pregunta aquí es ¿por qué llevar peso muerto cuando no es necesario?

Como parte de mis auditorías, siempre reviso la cantidad de tecnología de terceros que se utiliza en un sitio.

La forma más sencilla de hacer esto es utilizar herramientas de búsqueda de tecnología como BuiltWith y Wappalyzer (se pueden usar varias otras herramientas, tanto de pago como gratuitas, para hacer esto).

Estas herramientas son útiles cuando necesita tomar una decisión simple entre conservar o eliminar.

Sin embargo, si la tecnología todavía está en uso y necesita evaluar el beneficio de mantenerla frente al impacto que está teniendo en la carga del sitio, entonces es mejor que utilice herramientas de diagnóstico como Page Speed ​​Insight Tool y Lighthouse para resaltar el impacto en el rendimiento.

Si tiene más inclinaciones técnicas, puede usar la función Bloquear solicitudes de red de las herramientas de desarrollo de Chrome para ver qué tan rápido se carga la página cuando no se carga un script o recurso en particular.

Otra buena herramienta para visualizar la actividad de carga es RequestMap de webpagetest.org.

Este informe le brinda una representación visual del tamaño de los activos transmitidos por bytes utilizando los datos de solicitud de Chrome.

Utilizo esto cuando presento el impacto de la tecnología externa a C-suites que no saben nada sobre codificación.

Cuanto más antiguo sea el sitio, mayores serán las posibilidades de encontrar código externo que ya no esté en uso.

He encontrado:

  • Scripts para cajas de chat que ya no están en uso.
  • Diferentes versiones de widgets de consentimiento de cookies.
  • Píxeles de seguimiento de anuncios de software que ya no está en uso.
  • Y, lo peor de todos, el uso de un widget externo para los botones de compartir en redes sociales cuando un botón CSS sería suficiente.

Estos scripts son fáciles de eliminar ya que no afectan la integridad general del resto del código del sitio.

Alternativamente, si necesita conservar estos scripts, mueva todos los que sean compatibles a Google Tag Manager (GTM) o al administrador de etiquetas que utilice para reducir la cantidad de búsquedas de DNS que realiza el navegador.

Revise los scripts del administrador de etiquetas con regularidad para deshacerse de los scripts innecesarios.

También puede usar el activador cargado por ventana en GTM para retrasar la carga de scripts que no son necesarios tan pronto como el visitante llega a la página hasta que la página está completamente cargada.

2. Implementar Precarga y Preconexión de DNS

La captación previa y la preconexión de DNS son sugerencias de recursos del navegador que se pueden utilizar para acelerar las búsquedas de DNS.

Los navegadores suelen esperar hasta que necesitan un recurso antes de intentar solicitar el origen de ese recurso.

Mientras se solicita ese recurso, la carga de toda la página está en espera hasta que se resuelva.

La captación previa de DNS es una forma de llamar al origen de recursos no críticos antes de que sea necesario, lo que acelera el tiempo de búsqueda al darle al navegador una ventaja.

Puede obtener widgets de terceros que se mostrarán en la parte inferior de la página, como cuadros de chat, botones para compartir en redes sociales, widgets de encuestas, etc.


Chrome dev tools JavaScript console window

La preconexión también se usa para establecer una conexión temprana, pero debe usarse para recursos que son críticos para la carga de la página, como activos alojados en redes de entrega de contenido, fuentes web, etc.

3. Utilice una única biblioteca de JQuery cuando sea posible

Algunos scripts de terceros vienen con una biblioteca jQuery.

En términos simples, jQuery es una biblioteca de JavaScript que simplifica el uso de funciones de JavaScript.

La mayoría de los sitios web modernos tienen alguna forma de JavaScript, por lo que ya tendrían una versión de jQuery cargada en el sitio.

Es un desperdicio de recursos extraer dos versiones de esta biblioteca en su sitio cuando solo necesita una.

Al cargar un script externo, siempre pida una versión que no cargue su versión de jQuery.

Su desarrollador puede configurar el script para usar la versión global que se está cargando en su sitio.

No olvide probar que el script que está cargando sea compatible con la versión de jQuery en su sitio.

Use la ventana de la consola de JavaScript de las herramientas de desarrollo de Chrome para ver qué versión o versiones de jQuery se están cargando en su sitio.

Escriba Ctrl + Shift + J para abrir la consola, luego escriba console.log (jQuery (). Jquery); en la línea de comando.

Chrome dev tools JavaScript console window

Yellow Lab Tools tiene una interfaz simple para verificar las versiones de jQuery.

Yellow Lab Tools jQuery Result

Otras formas de reducir el impacto de cargar archivos jQuery incluyen usar la última versión y entregar jQuery a través de las bibliotecas alojadas de Google.

4. Eliminar instrucciones CSS redundantes para compatibilidad con navegadores antiguos

Cuanto más antiguo sea el sitio, mayor será el recuento de delitos.

Eliminar las instrucciones CSS redundantes como la compatibilidad con el navegador antiguo (IE Fixes) y los prefijos antiguos es fácil porque normalmente es un bloque de código separado.

Yellow Lab Tools jQuery Result

Muchas herramientas resaltan CSS no utilizado en un sitio.

Sin embargo, en lugar de tener que buscar en el código línea por línea el prefijo anterior y la compatibilidad con el navegador, Yellow Lab Tools le brinda una lista fácil de entender en la que puede hacer que su desarrollador trabaje.

Asegúrese de revisar su herramienta de seguimiento para ver la cantidad de visitantes que todavía usan estos navegadores antiguos y si los números garantizan que mantenga el soporte en su lugar.

En conclusión

Existe una gran cantidad de tecnología asombrosa que mejora la forma en que nos dirigimos y rastreamos a los visitantes de nuestro sitio.

Si bien la velocidad siempre será una preocupación importante, brindar la mejor experiencia a los usuarios siempre será una prioridad máxima.

La auditoría regular de sus scripts externos lo ayudará a brindar la mejor experiencia a sus visitantes de la manera más eficiente.

Yellow Lab Tools - Old prefixes result

Más recursos:

  • Cómo identificar y reducir los recursos que bloquean el procesamiento
  • Google SEO 133: Optimización de la velocidad de la página
  • SEO técnico avanzado: una guía completa

 

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *