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.
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.
Debes de optimizar WordPress como explico paso a paso en mi libro WPO para WordPress o en WPOptimizers si también quieres tener soporte personalizado y aprender más sobre 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.