Site logo

Archived topic

Excessive DOM size - how to decrease

3 replies · Started by jasmeet on July 13, 2019

Viewing posts 1–4 of 4

Hello

Although the site is still in pre-launch (staging) phase, Could see that Generatepress theme adds excessive DOM elements - appending to body class which is suggested to be avoided as seen here as it impacts site loading speed -

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwww.lessonsatstartup.com%2Flasu-staging%2Flasu&tab=desktop

Note - Most of them are coming from default stage

Kindly suggest workaround for this

Attached screenshot also for reference
https://cl.ly/80db9254b252

Hi there,

you're misreading the problem. This:

<body class="home page-template-default page page-id-2411 wp-custom-logo wp-embed-responsive post-image-aligned-center slideout-enabled slideout-mobile sticky-menu-no-transition sticky-enabled both-sticky-menu mobile-header mobile-header-sticky no-sidebar nav-float-right fluid-header separate-containers active-footer-widgets-1 nav-search-enabled header-aligned-left dropdown-hover offside-js--init customize-support" itemtype="https://schema.org/WebPage" itemscope="">

Is not an issue - what it says is there are 166 direct children within the body of the page. The Theme itself adds very little elements to the page. You can see this by testing the generatepress site.

The issue is related to the number of elements added in your content - some of the block plugins you're using add a lot of element wrappers.

Hello

Thanks - Will be doing my further research and reviewing as to where and how I can decrease number of parent elements although I had preferred to use Guternberg blocks this time instead of using Page builders for building pages for optimization purposes primarily :)

Although, I still wonder why does the theme have so many body classes even in "Default stage" - screenshot taken in default stage - https://cl.ly/3635a63bbe0d

and more keeps getting appended as we customize to add certain features like sticky bar etc

Those body classes allow us to use simple CSS to execute multiple options from the Customizer. It's actually a far better approach (performance-wise) than using PHP to execute those options.

This archived topic is closed to new replies.