CMS Development

icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

How can I fix this? If it was an embedded form, I could just defer it, but it's built into hubspot.

 

icheshire_0-1685582213633.png

Blocking this forms request (not leadflows, just forms) consistently brought loading time down by at least 10 points.

0 Votes
13 Réponses
Teun
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

Hi @icheshire ,

 

You could try and lazyload the HubSpot form if it is below the fold. That way, the script shouldn't load until the user is scrolling towards the form. I found this post, but haven't tested it myself.
I know you said that it is a HubSpot website, but you could create a custom module and add this functionality instead of using the default form modules (or HubL tags).

The other solution is to not use the HS form at all and simply go for a custom build HTML form and use the form submission API, but it really depends on how much effort you want to put into this.



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

Ok - so instead of embedding the form in the CMS, I use hubspot's script as if I was using a non-cms site? Is it possible my script is heavier for some reason, or I'm doing something wrong, or does every CMS site with forms take such a big performance hit?

0 Votes
Jnix284
Au panthéon de la communauté

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

nice find @Teun , will have to test this script out! 

 

I wasn't sure if @icheshire's  website was hosted on CMS Hub, which has limited options unless you want to create a custom module or API like you suggested.

 

Our theme has a custom forms module with an option to defer if it is out of viewport, but it uses a different method.

 

 


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Votes
icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

Yes, I'm using the CMS. What method do you use?

0 Votes
Jnix284
Au panthéon de la communauté

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

@icheshire our solution has to do with how the assets are loading in the theme, it looks like your website isn't built with a theme/DnD, so I'm not sure how you would (or could) implement for the old coded templates.

 


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Votes
icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

I think we use a custom coded theme. Wdym by "old coded templates"?

0 Votes
Jnix284
Au panthéon de la communauté

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

@icheshire I didn't see any dnd (drag-and-drop) areas in the code, which is what themes use to allow the modules to be added to the page directly (not from design tools).

 

The old coded templates can only be edited on the page, not added/removed.

 

This is an overview of themes and this is about custom coded templates.

 

If you're using a theme, you'll edit the styles globally and you would see your themes here in your HubSpot settings:

Jnix284_0-1685738807019.png

 


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Votes
icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

I think we're using a theme, since DnD works and I see that section in settings. How would I use your solution in my custom theme?

0 Votes
Jnix284
Au panthéon de la communauté

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

@icheshire there really isn't anything you can do to improve the impact of the forms JS...other than removing the form.

 

I dont know what page you have the form on to see if it's part of your conversion path, but if it's your home page or other high traffic page, you could replace the form with a high value CTA section that links to a dedicated landing page with the form.

 


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Votes
icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

It's https://www.colearn.com. 

That's a good solution, but I think it wouldn't work too well on something like an email list:

icheshire_0-1685659893687.png

 

Jnix284
Au panthéon de la communauté

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

true, that wouldn't work so well, you could try using a slide in form instead, but the script for that is about the same.


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Votes
icheshire
Participant

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

What's a slide-in form?

0 Votes
Jnix284
Au panthéon de la communauté

Hubspot forms brings Lighthouse Pagespeed from 96 to 80

@icheshire a type of pop-up form you can configure

 

https://knowledge.hubspot.com/forms/create-pop-up-forms


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Votes