Newsletter > WPO WordPress > Cómo evitar un tamaño excesivo de DOM en WordPress

Cómo evitar un tamaño excesivo de DOM en WordPress

Optimizar DOM WordPress

En esta guía de enseñaré a evitar un tamaño excesivo de DOM en WordPress.

El Document Object Model o DOM de WordPress, son los componentes HTML que componen la web.

Desde DIVs, cabeceras, textos, imágenes, vídeos y demás. Cada componente nuevo, es un nodo más en el DOM.

Puedes medir el DOM con PageSpeed y si está mal, este te dará un error en rojo de "Evita un tamaño excesivo de DOM".

El que ves es el DOM de mi web que está totalmente optimizado.

Evita un tamaño excesivo de DOM PageSpeed

Cómo evitar un tamaño excesivo de DOM en WordPress

Te voy a dar las claves para optimizar el DOM de WordPress.

Pero un DOM optimizado no mejorará mucho la velocidad de WordPress.

Usa un tema ligero

Un tema ligero evitará tener montones de nodos dentro de otros nodos como DIVs, que no sirven para nada.

Yo siempre recomiendo Astra, aunque hay muy buenos temas.

Usa un builder ligero

Hay builders que meten montones de DIVs dentro de otros, que al final termina por sumar mucho más de lo recomendado.

Gutenberg es una buena opción, aunque Elementor ha optimizado su DOM en la versión 3.0.

Limita el contenido

Lo que más reduce el DOM de WordPress es limitar el contenido de la página.

Una gran idea es limitar el número de párrafos, pero ojo, no te recomiendo hacerlos muy grandes, puesto que en móvil se verán grandes textos.

Si has seguido el consejo de separar el contenido en secciones, seguramente el número habrá bajado.

Pero si usas párrafos de una línea en un texto muy extenso, puede que tengas que reducirlos a párrafos algo más grandes, para que haya menos nodos.

Te recomiendo limitar el número de post que muestras en el blog o en las páginas de categorías o etiquetas.

De esta forma no tendrás problemas con superar los límites recomendados para el DOM.

Intenta limitar el número de productos de WooCommerce que muestras en el home o en las páginas de categorías y etiquetas.

Según el tema o builder que uses, si es que usas alguno, podrás mostrar más o menos componentes.

Si tienes una web en la que dejen muchos comentarios, deberías de limitar el número de comentarios que se muestran.

Esto lo puedes hacer desde Ajustes - Comentarios - Separar los comentarios en páginas de...

Según el DOM que tengas, podrás mostrar más o menos comentarios, así que analiza la web con diferentes combinaciones.

Activa la carga diferida

Activar Lazy Load te permitirá no cargar las imágenes de la web, hasta que el usuario llegue a ellas.

Pero esto también reduce el número de nodos de la web, lo que la hará más ligera.

Echa un vistazo a mi guía de optimizar imágenes en WordPress.

Evita un tamaño excesivo de DOM en WordPress

Como has podido ver, se pueden hacer muchas cosas para optimizar el DOM de WordPress.

Al reducirlo, acelerarás mucho tu web, lo que te ayudará a optimizar las Core Web Vitals en WordPress.

Espero que esta guía te sea de utilidad.

Si lo necesites, hay 3 maneras en las que puedo ayudarte:

1. Formación WPOptimizers: Aprende paso a paso a optimizar el rendimiento de WordPress o crear una nueva web WordPress optimizada.

2. Consultoría WPO: Como consultor WordPress especializado en optimización WPO, analizaré tu web y te diré cómo resolver los problemas de rendimiento.

3. Servicio WPO: Deja tu web WordPress en mis manos y haré que vuele de rápida con mi servicio de optimización.