Performance when multiple CTA's are loaded on a page

Highlighted
Top Contributor | Diamond Partner

It looks like for each and every CTA, that Current.js, cta-loaded.js and a tracking pixel load individually for each - is there any way to reduce the number of lookups here and have multiple CTA's on a page without the performance hit?

0 Upvotes
4 Replies 4
Highlighted
Community Manager

Hey @bschneidewind 

 

 I will tag a few of our experts 🙂     

 

Hey @Jsum , @Anto @tjoyce  could you please share your knowledge with @bschneidewind ?

 

Thank you,

Sharon 


We are excited to announce that the Community will be launching a weekly newsletter on November 2, 2020!
Sign up today!
0 Upvotes
Highlighted
Top Advisor | Platinum Partner

@bschneidewind - Have you run benchmarks on the perfermance degredation of the page load? I have done in depth testing on browser caching as it relates to loading in a single asset multiple times and the conclusion is that there is so little of a performance hit from pulling assets from cache that it's not worth worrying about it in the slightest. 

 

If you include a js file on a page, it will get stored into cache at minimum for the current page load. You could include that same js file 100 more times on the page and the browser will only pull that from the network once

 

See this plunker

 

You will notice that there are 4 CTA's included, however, the network calls to current.js and loader-v2.js are only made once, every subsequent call will be made from cache. 

 

plunker.png

 

All of that being said. Just take the current.js file out of the embed code and put it in the head of your html page, and exclude that file from all of your CTA's

 

 

 

Highlighted
Top Contributor | Diamond Partner

thanks @tjoyce ~ the issue I'm running into is the current.js seems to be render blocking and we have a client that has setup an extremely large amount of CTA's on a specific page... I'm working on convincing them to reduce the number of CTA's but in the interim, I'd love to explore the idea you mentioned with moving current.js to the header.... that should solve the issue w/ multiple calls occuring.


One part I'm confused on though, how would you remove the current.js from the embed code when it is a core module? It doesn't look like those can be edited - can they?

0 Upvotes
Highlighted
Esteemed Advisor | Partner

@bschneidewind  the scripts are plugged in through the embed code, for every embed.