Solved

Klaviyo JavaScript Speed Concerns

  • 19 March 2021
  • 5 replies
  • 156 views

Badge

Hi,

I’m finding the Klaviyo javascript files that are loaded on my woocommerce site are quite large and to slow to load, especially the signup forms code. This is effecting my page speed scores, especially on mobile. Is there any way to  reduce the size or improve speed.

e.g: the worst two doing a speed test on 4G with iPhone 8

https://static.klaviyo.com/onsite/js/vendors~signupForms.c5281a1cf01a6aa6b778.js is 62Kb and takes 980mSec

https://static.klaviyo.com/onsite/js/signupForms.f623ff6bb42172cd72c3.js is 35Kb and takes 540mS

 

The images are also a big hit and get this warning, is there a way to set them to lazy load or serve webp format (i do that with all other images on the site)

Consider lazy-loading offscreen and hidden images after all critical resources have finished loading to lower time to interactive

 

Resource Savings in bytes
https://d3k81ch9hvuctc.cloudfront.net/company/XWgQBz/images/adf82c19-9267-44e8-987c-842a747773a6.jpeg 50,511 bytes
https://d3k81ch9hvuctc.cloudfront.net/company/XWgQBz/images/7cba6e5f-3c66-4531-b58d-29b2a2870a66.png

40,790 bytes

 

 

icon

Best answer by julie.accardo 20 March 2021, 15:54

Hi @dethorpe,

The JS plugin added to your site by Klaviyo loads asynchronous, which means it will load once your website has fully loaded. This shouldn’t be impacting site performance.

As an alternative option, you do have the ability to create a custom integration that does not use the plugin. This guide walks through the process: https://help.klaviyo.com/hc/en-us/articles/115005082927-Integrate-a-Custom-Ecommerce-Cart-or-Platform

Best,

Julie

View original

5 replies

Userlevel 3
Badge +3

Hi @dethorpe,

The JS plugin added to your site by Klaviyo loads asynchronous, which means it will load once your website has fully loaded. This shouldn’t be impacting site performance.

As an alternative option, you do have the ability to create a custom integration that does not use the plugin. This guide walks through the process: https://help.klaviyo.com/hc/en-us/articles/115005082927-Integrate-a-Custom-Ecommerce-Cart-or-Platform

Best,

Julie

Badge

Thanks Julie, It’s not the plugin code itself i see an issue with though, your right that is async, and i’ve set it to defer as well.

it seems to be the extra js and images for the embedded and pop-up sign ups forms that is pulled in. I get these warnings, which sounds like things are not defered or lazyloaded

Consider lazy-loading offscreen and hidden images after all critical resources have finished loading to lower time to interactive.

for: https://d3k81ch9hvuctc.cloudfront.net/company/XWgQBz/images/adf82c19-9267-44e8-987c-842a747773a6.jpeg

https://d3k81ch9hvuctc.cloudfront.net/company/XWgQBz/images/7cba6e5f-3c66-4531-b58d-29b2a2870a66.png

 

Reduce the impact of third-party code Third-party code blocked the main thread for 1,380 ms :

For:

Third-Party
Transfer Size
Main-Thread Blocking Time
Klaviyo
258 KiB
1,381 ms
…js/vendors~View.6cd7a29….js
(static.klaviyo.com)
70 KiB
1,023 ms
64 KiB
208 ms
…js/signupForms.fa5599b….js
(static.klaviyo.com)
36 KiB
149 ms
     

 

 

Maybe I’m misunderstanding these warnings, but sounds like there is more impact than i’d like here, can I do anything to help improve this?

Userlevel 4
Badge +4

Hi @dethorpe,

Can you clarify if you’re using embedded, popup, or flyout forms? Additionally, have you set the form JS scripts to load asynchronously?

Best,

Caroline

Badge

Hi,

I’m using an embedded footer form and a popup after 15secs. The plugin is set to async and deferred using the asset speedup pro plugin.

I haven’t seen anywhere to set option for the signup form js though, how do i do that, is there some settings in klavio? I could possible set the JS URLs to defer using the WP rocket caching plugin, will try that.

Userlevel 4
Badge +4

Hi @dethorpe,

You can add a short time delay to popup or flyout forms (3-5 seconds). Sometimes our forms load too quickly and some speed testing tools count that as part of the page loading time.

Best,

Caroline

Reply