Why does every single element get custom css in the code?

Been investigating an issue with H1 tags not being recognized by some crawlers (most SEO tools).

Embarrassingly, this is the first time I’ve really inspected the html and CSS of a page properly. From what I can see, every single element is getting 1. A class assigned, and 2. A whole bunch of custom css styles assigned:

(FYI, the element being inspected here - the H1 tag - has got a style defined for it)

This is compared to when you add a class to an element in Webflow:

This is as it should be IMO. All class styles are attached to a class, no need for extra CSS on the element in inline styles.

Surely this has an effect on page load speed? Is there a reason this is the way it is?

1 Like

@josh do you have any insight here

Would love to know more about this topic as well. Very relevant @simonpurdon10 !

As I know, ideally to have a CSS file and assign class names to most elements. But that thing has a lower priority compared to other important things.

If we check out how Adalo handles it (built on React):

We can notice, that their way also isn’t ideal.

So, not sure if we need to worry about this for now, since the new engine generates the HTML code of the elements pretty fast.

Plus, Bubble started to work on a lovely feature, that will generate the HTML code of most elements on the server-side beforehand. That will speed up the apps even more! But, it’s very hard to implement, so, they cannot provide ETA.