🚀 Feature Request: Reduce the DOM size even more

[udrzbarik]

Prerequisites

• I have searched for similar features requests in both open and closed tickets and cannot find a duplicate.
• The feature is still missing in the latest stable version of Elementor ( Elementor Pro )

What problem is your feature request going to solve? Please describe.

When you look at Elementor's DOM, for example a button, you have SIX DOM elements nested into each other, this is a nonsense. When you look at for example Bricks Builder, they are doing quite fine with a span with some text.

Elementor DOM elements for one simple button

Bricks DOM elements for the same button

Describe the solution you'd like

I'd like to start a discussion, on whether it is possible to reduce the amount of nested elements, for widgets.

Describe alternatives you've considered

No response

Additional context

No response

[79ho3ein]

I love Elementor. But it is really strange and I would like to know why this matter was not paid attention to since the birth of Elementor. Elementor websites have a lot of DOM elements. This is an undeniable fact. I can say that this is the only weakness of Elementor and I don't know if it can be solved or not. Because this is the basis of Elementor.
I sometimes argue with those who oppose Elementor. The only weakness they know in Elementor is this issue, and I cannot deny this issue. You are right. Bricks is completely in control of this matter. No additional DOM is generated in bricks. I am completely proficient in bricks. But I still stay in Elementor because it's hard to leave home😂

Anyway, I hope Elementor will seriously focus on this and improve it. Also, if members of the Elementor team are reading this, we'd love for them to share their thoughts with us.

[tobias992]

I can give you the answer from the Elementor dev team:

Thanks for the note - we will look into it. But...

1. We have already improved our DOM structure
2. It's not that easy because we have to be backwards compatible.

Nothing will change. Look at the Font Awesome 6 support. This is a joke.

Elementor is a company that needs to make money. So it's better to release a buggy new feature (the hover color of the mega-menu has been buggy since release) than to improve the system. Because new features bring new customers. I know all the blind fanboys hate me now, but this is the truth about the Elementor dev team.

[udrzbarik]

I thought the hovers were on my side lmao, okay, gotcha, I didn't expect hearing anything else.

[ayoubkhan558]

+1

[rodolphebertozzo]

this problem has unfortunately been known for many, many years, very insignificant and slight improvements have been made, it is true, but it is not enough at all... If it is true that this can cause problems with compatibility with existing sites because changes of this scope inevitably impact the entire structure, I am unfortunately afraid that Elementor does not want to treat this problem seriously, preferring instead to focus on the development of artificial intelligence functionalities.. .
If other builders like Bricks innovate with features like AI, I think that will be the end of Elementor.

[elhamshari]

This is good idea .
but one more helpful thing , is to change the name of classes from "elementor-button-text" like in example to "elmntr-btn-text" or any way to make less letters . applying for all classes . it will help in reducing DOM Size .

[m1ga]

the new Elementor classes are already like .e-n-accordion or .e-con-inner. It would break so many pages, external plugins or themes if they would do it for existing elements.

Keep in mind: DOM size is the size of the nodes not the classes. So it would only reduce your HTML size but not that much.

[nicholaszein]

Hello everyone,

thank you all for your feedback! 🙏

I wanted to talk to you about your concerns regarding the DOM size and if it's possible to reduce it even more.

At Elementor we are always working on improving performance and reliability. Our goal is to keep working on these areas and to introduce even more optimizations that can help improve performance. We have not stopped working on this matter!

However, we need to be responsible. This means making sure we are backward compatible, and that all users can transition to improved features without any issues at their own pace. This also means it takes time. We need to work on improving our codebase. Creating a good, reliable, and stable infrastructure that will allow us to prepare for these changes, and give room for more improvements. We need to test, make mistakes, fix those mistakes, improve again, and iterate. This work never stops. We do have plans to improve the DOM size even more, but not before ensuring we have a smooth transition.

The reason why widgets have nested elements is that, along with other reasons:

1. First and foremost, backward compatibility;
2. They support many other Elementor features, like Motion Effects, Masks, Transforms, positioning, etc.;
3. They give the flexibility to fine-tune individual elements styles inside each widget.

It is true that some of these nested elements are no longer needed and could be removed, and are a legacy of what was necessary with our old framework. But we won't do this in a way that can negatively affect most websites.

The good news is that we have plans to remove them, especially since we want to introduce the class system and other features that would greatly benefit from the simplification of the DOM, but we need to be careful not to break anything as much as we can.

In summary, we hear you! And we are working on improving our infrastructure. But it will take time. And we want to do it right. All we ask from you is patience and understanding. 🙏

Thank you so much for sharing your thoughts and suggestions. It really means a lot to us! Please, keep them coming! Your feedback is what drives us forward.

There is only one thing I ask, and this is my personal request:

Please don't use this platform for personal complaints. Let's focus on discussing the product. We have Guidelines, and I would hate to have to remove posts or comments that go against them.

Kind regards

[tobias992]

It's NOT a personal complaint that you are release buggy new features - that's the truth. And that we have been waiting for Font Awesome 6 for many month. Sorry Elementor-Team, but in my opinion you are far away from a professional line. And if you don't change this, in my opinion other page builders will kick you out of the market.

I am a paid customer. I pay every year for the agency license. So I definitely have the right to inform about grievances here. Or are you no longer capable of criticism?

[nicholaszein]

@tobias992 this is simply not the place for this kind of feedback. I can't act upon it. There is a dedicated channel for complaints, and it's with the Support on your Elementor Account. There your complaints will be recorded and passed along to the right people. I don't have this capability here.

[nicholaszein]

It also means more time addressing complaints, and less time fixing bugs and adding features.

[portrayaloflife]

Just want to say, shout out to @nicholaszein for so professionally and respectfully fielding all the angry comments he does. It can't be easy, appreciate all the hard work you are doing for Elementor and for us, we appreciate you, even in the face of user grievances, being so kind and communicative. Keep up the awesome work!

[d4mourtzis]

I understand that it takes time to refine the core but can you just add some some hidden option that will show a new widget in the editor that we will use to put plain code in parent dome and have no options at all from elementor so we can put our code there.

[ayoubkhan558]

Elementor 3.20 beta was released with a reduced DOM version.

🔥 Elementor v3.20 Beta Release #25200

[m1ga]

not really true: https://github.com/orgs/elementor/discussions/25200#discussioncomment-8518093 it's reducing HTML attributes but the DOM size stays the same.

[nicholaszein]

@m1ga, once again you are correct! (🙏)

However, the less cluttered container attributes does help improve performance. Not a lot, but still... Which is the root of the complaint here. So while I won't be closing this as solved due to this new update, it still is something that addresses this discussion. So I'm happy to see someone recognized this improvement.

Baby steps. 🙂

[m1ga]

Which is the root of the complaint here

The first post/question is about reducing the nested DOM elements: ...for example a button, you have SIX DOM elements nested into each other, this is a nonsense. When you look at for example Bricks Builder, they are doing quite fine with a span with some text....

That is a different check in the Page Speed result ("nested DOM size"). Reducing the HTML output is always good but in this case it is very little to have a performance impact 😉 E.g. add some new widgets without the elementor-widget-container so people can use that instead and you have full backwards compatibility. I'm using that approach with custom widgets in some projects and it works fine so far.

[udrzbarik]

Hello @nicholaszein I actually meant what @m1ga said, but don't worry any longer, I don't even expect you to care about this, as you guys don't even fix stuff that actually had been reported and marked as a bug like a year ago, I actually respect that and accept it, that's why I ceased all my development (custom plugins) activities towards Elementor and switched to Bricks.

[nicholaszein]

This request was mentioned in the following issues and discussions:

• 🔗 🚀 Feature Request: Make title elements self-containing (DOM optimization) (Merged with #23059) #17166