Lazy loading images is a great feature, but we currently cannot lazy load image CTAs. We've recently had success with GIF CTAs, but we are hesitant to use them on our top ranking blogs until we can lazy load them for fear of affecting page load time.
Would be even better if we could lazy-load ALL CTAs, meaning the image isn't requested AND the hbspt.cta.load() function wouldn't fire until a user actually scrolls within a reasonable distance of the instance (this would save a network request as well). I've done this with custom modules before using intersectionObserver, but native functionality would be awesome.
Hate to say it, but the lack of this makes HubSpot an easy target for dev teams who are annoyed with their marketing counterparts slowing down their efficiently coded website with third party scripts, especially with Core Web Vitals rising in importance.
I've heard this conversation a few too many times:
Marketers: Can you reduce all this unused JavaScript?
Devs: That would be a very heavy lift, so, no. Besides, most of the unused JavaScript isn't coming from our site, it's coming from HubSpot. What about that HubSpot CTA, cant you just remove that and insert an image instead? Then you can lazy load it and serve via our CDN.
I have CTAs where an image tag is part of the content of the CTA. I edit the CTA html directly, and If I add the loading="lazy" attribute it gets stripped out again when I save the CTA.
Please to start with, just stop stripping it out for people like me who are editing the html.
