What is the optimized DOM?

A partir de Elementor 3.0, se han realizado algunas mejoras importantes de DOM para aumentar la velocidad y el rendimiento de los nuevos sitios Web de Elementor. Elementor se esfuerza por ser lo más rápido y optimizado posible. Para ello, hemos reducido algunos elementos DOM de la salida HTML.

The presence of these containers was due to the diverse use of Elementor, the ability to use these selectors in various ways to customize your site, and the universal purpose of Elementor as a solution for creating visually advanced websites.

Removing wrapper elements from the DOM contributes to more simplified code output, better readability, and less complexity. A smaller DOM helps increase speed and performance. However, this is a potentially significant change, so Elementor will default to Disabled for all sites.

What HTML wrappers were removed in 3.0?

Three (3) HTML containers are removed, including:

• .elementor-interior
• .elementor-row
• .elementor-column-wrap

Who is affected by this change?

By default, it is set to Disabled to avoid breaking existing sites that are upgraded to 3.0. Using optimized DOM output on existing sites that are upgrading from a version prior to 3.0 could cause the appearance and / or functionality of your website to break. For this reason, optimized DOM output is disabled on upgraded sites and the legacy DOM remains in place. However, if you upgrade to 3.0 and want to use optimized DOM output, you can enable this feature. Just go to Elementor> Settings> Advanced and select Enable at Optimized DOM output drop down. For now, this is also set to Disabled by default for new sites, although this may change in the future.

Important: Si ha utilizado alguna de estas clases contenedoras en su CSS personalizado o en su código personalizado, debe refactorizar su código para usar diferentes clases contenedoras que no se están eliminando. De lo contrario, sus estilos o códigos personalizados ya no funcionarán correctamente.

See the developers post on this change here.