Lazy loading

@enumis

Thanks for reaching out to us. Please try the following snippet using the Code Snippets plugin or keep it inside your current/child theme’s functions.php:

add_filter( 'woo_variation_gallery_image_inner_html', function( $inner_html, $image, $template, $attachment_id, $options ){
	$template = '<div class="wvg-single-gallery-image-container"><img width="%d" height="%d" src="%s" class="%s" alt="%s" title="%s" data-caption="%s" data-src="%s" data-large_image="%s" data-large_image_width="%d" data-large_image_height="%d" srcset="%s" sizes="%s" %s /></div>';

	$inner_html = sprintf( $template, esc_attr( $image['src_w'] ), esc_attr( $image['src_h'] ), esc_url( $image['src'] ), esc_attr( $image['class'] ), esc_attr( $image['alt'] ), esc_attr( $image['title'] ), esc_attr( $image['caption'] ), esc_url( $image['full_src'] ), esc_url( $image['full_src'] ), esc_attr( $image['full_src_w'] ), esc_attr( $image['full_src_h'] ), esc_attr( $image['srcset'] ), esc_attr( $image['sizes'] ), $image['extra_params'] );

	return $inner_html;
}, 10, 5);

Then check whether it resolves your issue or not. Hope to hear from you soon.

Thanks

Thank you very much!

Its helped!

Sorry for another question. How to reduce DOM depth? On a speedpage test it is showing it is due to an image.

@enumis

I am very glad that it helped.

For your second question:

To visualize the gallery, we used a JS library. And to get it to work with the JS library, we had to keep the markup like that.

I hope you will understand the situation.