Cómo arreglar un sitio web lento de Elementor: 16 optimización que me ayudó a obtener calificaciones de velocidad de página del 100% y tiempos de carga instantánea en mi sitio

Elementor dice que son el creador de páginas más rápido para WordPress.


Entonces, ¿qué está causando que su sitio web de carga lenta?

Por lo general, hay algunos ajustes simples que pueden mejorar significativamente los tiempos de carga y los puntajes de GTmetrix. Elementor dice Las razones más comunes para un sitio lento de WordPress son servidores, medios, scripts externos (por ejemplo, Google Fonts), complementos, sin CDN y el uso de un complemento de caché mediocre. Sin embargo, no entran en muchos detalles en la lista de instrucciones paso a paso..

Por eso escribí este tutorial.

Aprenderá cómo arreglar su sitio lento de Elementor siguiendo las recomendaciones clave de la guía de optimización de WordPress y las recomendaciones de Elementor. Proporcionaré capturas de pantalla, instrucciones detalladas y responderé todos los comentarios si aún necesita ayuda. Logré obtener puntajes de GTmetrix al 100% en mi página de inicio. Incluso las publicaciones con más de 100 imágenes y más de 400 comentarios (tamaño de página de 5 MB y 170 solicitudes) aún se cargan en aproximadamente <2s. Sí, soy un nerd de la velocidad de WordPress :)

Elementor Speed ​​Optimization

1. Actualización a PHP 7.4

Muchas empresas de hosting ya han lanzado PHP 7.4.

La actualización de las versiones de PHP es una de las formas más fáciles de acelerar su sitio Elementor. Kinsta Puntos de referencia PHP muestra cómo las versiones superiores de PHP pueden ejecutarse 2-3 veces más rápido. Elementor también recomienda versiones superiores de PHP y para aumentar el límite de memoria a 256 MB (consulte el siguiente paso).

Primero, verifique su versión PHP actual en Elementor > Información del sistema.

Versión de Elementor PHP

A continuación, inicie sesión en su cuenta de hosting, busque el administrador de versiones de PHP (o similar) y seleccione una versión de PHP más alta. También es una buena idea hacer una copia de seguridad de antemano. De lo contrario, eso es todo!

Kinsta PHP 7.4

Importante: asegúrese de que sus complementos sean compatibles con versiones superiores de PHP. Estaba usando WP Rich Snippets (que ya no se mantiene) pero era incompatible con PHP 7.2+, así que eliminé el complemento y encontré un reemplazo. No vale la pena mantener complementos no mantenidos.

2. Aumente el límite de memoria a 256 MB

Nuevamente, verifique su límite de memoria en Elementor > Información del sistema.

Tanto Elementor, WordPress y WooCommerce recomendar un límite de memoria de 256 MB.

Elemento o límite de memoria

Por lo general, puede cambiar su límite de memoria en su cuenta de alojamiento:

Limite de memoria

De lo contrario, agregue este código a funciones.php.

define (“WP_MEMORY_LIMIT”, “256M”);

3. Use fuentes autohospedadas

Si Google Fonts está haciendo explotar su informe GTmetrix, intente alojar las fuentes localmente.

Si usted tiene Elementor Pro, querrás usar fuentes personalizadas (que se encuentran en la configuración).

Aquí está un Tutorial de YouTube.

Fuentes personalizadas de Elementor

No tienes Elementor Pro?

Muchos complementos pueden ayudar a optimizar las fuentes de Google: WP Rocket, Autoptimize, fuentes de Google independientes, OMGF y limpieza de activos. Si tu no desea usar un complemento, siga estas instrucciones.

Paso 1: Confirme que las fuentes están ralentizando su sitio Elementor en GTmetrix.

Google Fonts GTmetrix

Paso 2: Descargue sus fuentes directamente desde el sitio web de Google Fonts. Solo descargue las fuentes y los pesos de fuentes que necesita absolutamente (más fuentes y pesos también pueden significar más solicitudes).

Paso 3: Use una herramienta como Transfonter para convertirlos en archivos de fuentes web.

Transfonter-Google-Font-Conversion

Paso 4: Cargue los nuevos archivos de fuentes web en WordPress y agréguelos a su CSS.

Paso 5: Pruebe las fuentes, agregue una falla predeterminada y siempre tenga fallas de fuentes.

4. Optimizar las solicitudes de terceros

Al igual que Google Fonts es una solicitud de un tercero, también lo son AdSense, Analytics, Maps, Tag Manager, videos incrustados e incluso Gravatars o complementos para compartir en redes sociales que pueden causar solicitudes de terceros..

Necesitas optimizar estos también.

Guiones externos

Algunas solicitudes de terceros son fáciles de optimizar:

WP Rocket tiene una pestaña Complementos que puede ayudar análisis de host localmente y agregue el almacenamiento en caché del navegador a Facebook Pixel. La configuración de medios de WP Rocket le permite cargar videos de manera lenta mientras reemplaza el iframe con una imagen de vista previa. Si inserta publicaciones de las redes sociales, intente tomar una captura de pantalla y usar una imagen en su lugar. Disqus Conditional Load, diferir el análisis de JavaScript en la configuración del complemento de caché y desactivar selectivamente los scripts / complementos en Asset Clean Up puede ayudar a optimizar los scripts.

WP Rocket Local Analytics

Otras solicitudes de terceros no son tan fáciles de optimizar:

Google AdSense puede ser un asesino de GTmetrix. Aparte de cargarlo de forma asíncrona, hay poco que pueda hacer. Tampoco encontré ninguna solución para hacer que Gravatars se cargue más rápido y probé todos los complementos de caché de Gravatar (así que los desactivé). El Administrador de etiquetas de Google generalmente solo debe usarse para sitios Elementor grandes y no optimizados, de lo contrario, generalmente hace más daño que bien.

5. Evite los complementos de CPU altos

Algunos complementos de los que deberías mantenerte alejado.

Los altos complementos de CPU que ralentizan los sitios de Elementor generalmente tienen que ver con estadísticas, copias de seguridad, intercambio social, carteras, chat en vivo, formularios de contacto, controles deslizantes, JetPack y cualquier complemento que se requiera constantemente para “trabajar” en su sitio web (piense en Broken Link Escaneos en curso del verificador).

  1. Agrega esto
  2. Monitoreo de fraude de clics de AdSense
  3. Calendario de eventos todo en uno
  4. Compañero de respaldo
  5. Beaver Builder
  6. Mejores WordPress Google XML Sitemaps
  7. Comprobador de enlace roto (use Dr. Link Check)
  8. Contacto constante para WordPress
  9. Formulario de contacto 7
  10. Publicaciones relacionadas contextuales
  11. Digi Auto Links
  12. Sistema de comentarios Disqus
  13. Divi Builder
  14. Rejilla esencial
  15. Ver la lista completa de 65 complementos lentos

Si tiene un complemento lento, puede eliminarlo y encontrar un reemplazo, deshabilitar selectivamente el complemento en ciertas páginas (siguiente paso) o continuar usándolo y tener un sitio Elementor lento.

6. Desactiva selectivamente los complementos no utilizados

Asset CleanUp y Perfmatters son excelentes para deshabilitar selectivamente los complementos, guiones y estilos.

El ejemplo más común es solo cargar su complemento de formulario de contacto en la página de contacto y deshabilitarlo en cualquier otro lugar. ¿Pero ha pensado en deshabilitar su complemento para compartir en redes sociales en sus páginas (dado que la mayoría de la gente solo lo usa en publicaciones)? ¿O deshabilitar el control deslizante en páginas que no tienen controles deslizantes? Mediante la desactivación selectiva, puede realizar menos solicitudes HTTP en las páginas.

Paso 1: Instale Asset CleanUp o Perfmatters.

Complemento de limpieza de activos

Paso 2: Edite una página o publicación y desplácese hacia abajo para ver todo lo que se carga en la página.

Paso 3: Deshabilita (descarga) complementos, scripts y estilos que no se usan en la página. También puede deshabilitarlo por tipo de publicación, o Asset CleanUp Premium (así como Perfmatters) le permite usar RegEx.

Limpieza de activos Verificar todo

7. Deshabilite los scripts, estilos y fragmentos de carrito de WooCommerce

Al igual que deshabilitó selectivamente los complementos en el paso anterior, puede usar Perfmatters y Asset CleanUp para hacer lo mismo con los scripts, estilos y fragmentos de carrito de WooCommerce.

Asset CleanUp WooCommerce

Perfmatters realmente te permite hacer esto con 1 clic:

perfmatters optimización de woocommerce

8. Cambiar el método del cargador del editor en Elementor

Elementor dice:

“Si tiene problemas de alojamiento o servidor con Elementor, hemos incluido un interruptor simple que puede resolver su problema”.

Puedes encontrar esto en Elementor > Configuraciones > Avanzado > Editor Cargador.

Método del cargador del editor de conmutadores Elementor

9. Cambiar el tamaño de las imágenes para corregir las dimensiones

Al usar Elementor, es importante escalar (redimensionar) las imágenes para que se ajusten a sus dimensiones correctas.

Servir imágenes a escala

De lo contrario, verá errores de servicio de imágenes a escala en GTmetrix. Si ve alguno, tome las dimensiones recomendadas proporcionadas por GTmetrix y cambie el tamaño de la imagen a esas dimensiones, luego reemplace la imagen. Recomiendo crear una “hoja de trucos de dimensión de imagen” que enumere las dimensiones de todas las áreas de su sitio web (controles deslizantes, imágenes destacadas, imágenes de blog de ancho completo, logotipo). De esa manera, puede cambiar el tamaño de su imagen a las dimensiones correctas antes de cargarlas.

10. Elimine el alojamiento compartido y actualice a la nube

Tener un tiempo de respuesta lento del servidor?

Ejecute su sitio a través de Google PageSpeed ​​Insights y asegúrese de que sea <200 ms como Google recomienda. Su servidor (hosting) es el Factor # 1 en la guía de optimización de WordPress.

Por lo general, recomiendo SiteGround (alojamiento compartido), lo cual está bien si tienes poco tráfico y complementos. Pero una vez que vaya al alojamiento en la nube (p. Ej.. Cloudways DigitalOcean), la diferencia es noche y día. Migré de SiteGround a Cloudways y mi tiempo de carga se redujo a la mitad. Incluso las publicaciones con más de 100 imágenes y más de 400 comentarios (tamaño de página de 5 MB, 170 solicitudes) aún se cargan en menos de 2 segundos.

Alojamiento Elementor

SiteGround-vs-Cloudways-Cloud-Hosting

GTmetrix-report-for-long-post

Experiencias de otras personas con Cloudways:

Tiempos de respuesta de Cloudways

Motor WP a Cloudways

Informe DigitalOcean Pingdom

Tiempos de respuesta del servidor de Cloudways

Mejora del tiempo de carga de Cloudways

Cloudways vs motor WP

Intitulado

Cloudways Pingdom Tiempos de carga

Informe de Pingdom de Cloudways

Migración de Namecheap a Cloudways

Cloudways WooCommerce Migration

Cloudways AWS Migration

También fueron # 1 en muchas encuestas de Facebook y tienen excelentes Opiniones de TrustPilot:

Recomendaciones de alojamiento Facebook

Encuesta WooCommerce VPS Cloud Hosting

Encuesta de alojamiento en la nube de VPS

Sugerencias de alojamiento de WordPress

Cloudways-Facebook-Review

Revisión de Facebook de Cloudways

Cloudways vs SiteGround

Línea de fondo: el alojamiento compartido está bien si no está ejecutando WooCommcerce, AdSense, complementos de CPU altos o si tiene tráfico decente. Pero una vez que tenga uno de esos, busque alojamiento en la nube. Sí, soy afiliado de Cloudways), pero hay muchas otras personas que migraron y publicaron sus resultados. El código OMM25 le dará un 25% de descuento en los primeros dos meses de alojamiento en Cloudways.

11. Elimine los complementos de caché gratis y use WP Rocket

¿Por qué WP Rocket suele ser el número 1 en las encuestas de Facebook??

Porque tiene más funciones de velocidad que la mayoría de los otros complementos de caché (limpieza de bases de datos, análisis local, combinación de fuentes de Google, imágenes de carga lenta + videos, CDN + integración de Cloudflare, control de latidos, almacenamiento en caché de WebP, captación previa, almacenamiento en caché del navegador de Facebook Pixel).

Es por eso que WP Rocket produce mejores puntajes + tiempos de carga en GTmetrix, y significa menos complementos en su sitio Elementor. Siempre se actualiza con nuevas funciones y es mantenido por un equipo confiable.

Entonces, si todavía estás usando WP Fastest Cache o W3 Total Cache, realmente deberías darle una vuelta.

2016 mejor encuesta de plugin de caché

Encuesta de plugin de caché 2019

Swift vs WP Rocket

Encuesta de plugin de caché 2016

Encuesta sobre los mejores complementos de caché 2018

wp rocket vs w3 totla caché

Verás la diferencia:

WP Rocket Antes Después

12. Limpia tu base de datos

¿Está programando limpiezas continuas de la base de datos??

A medida que continúe construyendo su sitio Elementor, acumulará revisiones de publicaciones, tablas de bases de datos antiguas de complementos / temas que ya no está utilizando, comentarios basura y otros archivos basura.

Puede usar complementos como WP Rocket y WP-Optimize para limpia tu base de datos de WordPress. Solo asegúrese de revisar todo lo que se está eliminando y de hacer una copia de seguridad de antemano.

Base de datos limpia de WP-Optimize

13. Use el CDN de Cloudflare

Usar Cloudflare es obvio.

Es gratis, tiene más de 200 centros de datos, y los CDN son recomendado por WordPress.

Logotipo de Cloudflare

Algunos hosts como SiteGround le permiten activar Cloudflare en su panel de control. De lo contrario, regístrese en el plan gratuito de Cloudflare, inicie sesión en el registrador de dominios y cambie a los servidores de nombres de Cloudflare.

En el tablero, hay algunos ajustes que debes considerar:

  • Velocidad: habilitar Brotli y Rocket Loader
  • Escudo de raspado: habilitar la protección de hotlink
  • Cortafuegos: bloquea los bots defectuosos del informe de tráfico en vivo de Wordfence
  • Reglas de página: Cloudflare tiene muchos reglas de la página para velocidad, seguridad, compatibilidad

14. Use un tema ligero

Tiempo de cuentos.

Estaba usando un tema ThemeForest que fue abandonado por el desarrollador (un riesgo que corres al comprar un tema de un desarrollador independiente, incluso si tiene buenas críticas). También tuve pesadillas al comprar temas hinchados para clientes que hicieron que su sitio de WordPress fuera lento.

Quiero decir, tener todo incorporado hace que sea mucho más fácil, ¿verdad??

¡No! Desea elegir un tema ligero que sea mínimo y esté bien codificado, luego confíe en los complementos para agregar solo las características que necesita. La optimización del tema es más difícil que eliminar un complemento.

La mayoría de ustedes, con suerte, están usando temas Astra, Flatsome o StudioPress, que son los principales que recomiendo.

15. Encuentra cuellos de botella en GTmetrix

Además de medir puntajes + tiempos de carga, puede descubrir bastantes cosas en GTmetrix. Como cada sitio de Elementor es diferente, desea encontrar exactamente lo que está ralentizando el suyo.

Tiempo al primer byte

Tiempo al primer byte

Imágenes sin optimizar

Optimizaciones de imagen en GTmetrix

Complementos lentos

Complemento lento de WordPress

16. Termine el último 10% de velocidad con perfmatters

Perfmatters (por Kinsta) se encarga de lo que me gusta llamar varias optimizaciones de velocidad:

características de perfmatters

Algunos de estos son extremadamente útiles; el administrador de secuencias de comandos que le permite deshabilitar selectivamente los complementos / secuencias de comandos de ciertas páginas, cambiando el intervalo de autoguardado, limitando las revisiones posteriores, preconectando e inhabilitando secuencias de comandos, estilos y fragmentos de carrito de WooCommerce. Cuando se trata de estas optimizaciones, no conozco ningún complemento que funcione mejor que Perfmatters..

¿Qué esperas? Es Kinsta. Por supuesto, es un gran complemento.

Preguntas frecuentes

&# x1f680; ¿Cuáles son las razones más comunes para un sitio Elementor lento??

No usar un buen complemento de caché, no configurar la configuración de su plugin de caché de manera óptima, alojamiento lento, imágenes no optimizadas, usar fuentes de Google y scripts externos, complementos de CPU altos y no usar un CDN son algunas de las razones más comunes para un sitio lento de Elementor.

&# x1f680; ¿Qué puedo hacer para acelerar Elementor??

Use la opción de fuentes personalizadas de Elementor para reducir la cantidad de solicitudes de Google Fonts o Font Awesome. También puede deshabilitar selectivamente las funciones de Elementor no utilizadas en páginas / publicaciones utilizando un complemento como Asset CleanUp o Perfmatters de Kinsta. El resto son optimizaciones de velocidad genéricas que no tienen nada que ver con Elementor.

&# x1f680; ¿Cómo se usan las fuentes personalizadas para que se carguen más rápido??

Necesitará una cuenta de Elementor Pro para hacer esto. Descargue sus archivos de fuentes (p. Ej. De Google Fonts) y cárguelos en la sección de fuentes personalizadas de Elementor.

&# x1f680; ¿Elementor está ralentizando mi sitio??

Elementor no causó ningún error en mi informe GTmetrix y se supone que es el creador de páginas de WordPress más rápido. No debería ralentizar mucho su sitio web, si es que lo hace. Pero si cree que sí, consulte la pestaña Cascada de GTmetrix para ver qué es lo que realmente está causando el problema..

&# x1f680; Qué alojamiento se recomienda para los sitios de Elementor?

En el popular Grupo Elementor de Facebook, SiteGround y Cloudways suelen ser los 2 principales hosts clasificados en las encuestas de Facebook.

Todavía tengo un sitio Elementor lento?

Diré esto: Cloudways y WP Rocket deberían solucionar el 80% de sus problemas. El alojamiento y su complemento de caché son los factores más importantes en la guía de optimización de WordPress. Pero si su sitio Elementor sigue siendo lento, envíeme un comentario con su informe GTmetrix y me alegra echarle un vistazo. Nuestro equipo también ofrece servicios de velocidad de WordPress con antes + después de los informes de GTmetrix.

Salud,
Tom

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map