Rich-text Reply

How to improve JavaScript code so it doesn't slow down a webpage?

im_omi 10-24-17

How to improve JavaScript code so it doesn't slow down a webpage?

[ Edited ]

I created this post in the wrong forum...and now I can't move it. https://community.optimizely.com/t5/Developers/How-to-improve-JavaScript-code-so-it-doesn-t-slow-dow...

----------------

 

Hi,

I'm looking for any  advice on improving my JS code or anything in general to prevent my webpage from slowing down any further. 

 

My current webpage takes ~6 - 11 seconds on a bad day. This is probably due to the images and several other JS/API calls that are being made. With the variant changes I've made it, it ends up taking twice as long...which is extremely frustrating.

 

I've implement my Experiment JS similar to the sample code below (I minify it before saving it in the editor):

 
// grabs and stores these before all the changes are made
var _globalVar1  = $("input[name='_global1']").val();
var _globalVar2  =  $("input[name='_global1']").val(); 

window.initABT = function() { 
// several (about 20) click and change events. These are on original and variant elements
$(".elment1").click(function() { // .on('click', function () {
}); 
$(".elment2").change(function () { // .on('change', function () {
}); 

// several functions (about 6) called in triggered events above 
function doThis() { ... }
function doThat() { ... }
}; 

// I've used this approach based on an article I found on Optiverse.
// Adding functions and trigger events directly in editor or in document ready didn't work.
$(window).bind('load', function() {
window.initABT();
});

I'm currently troubleshooting it based on the tips here: Troubleshoot Problems. So far nothing is improving the speed.

 

Note:

  • I'm using Optimizely Classic
  • Snippet size: 250 KB
  • New images and CSS file (48 KB) are being stored on an Amazon S3 instance. I'm importing the CSS

 

Any advice will be greatly appreciated.

 

Thanks in advance!

.omi

 

 

Level 2

0 Likes
0 Likes
tomfuertes 10-24-17
 

Re: How to improve JavaScript code so it doesn't slow down a webpage?

OptimizelyX has a reduced snippet size. Upgrade there for more performance.

 

Due to the fact Optimizely GZips the snippet on the CDN, the marginal performance gain of minification isn't worth the headache.

 

You code doesn't wait till window.load to run so the impact should be minimal. If it's taking 8-10 seconds my guess is it has nothing to do with optimizely.

 

Time minifying and optimizing optimizely's load chain isn't calculating the opportunity cost of efforts focused on the 6-11 seconds problem. My overall recommendation would be to focus there instead.


- Tom Fuertes | CTO @ CROmetrics / LinkedIn
"Most Impactful Use of Personalization" and "Experience of the Year" Optie award winner.
Experimentation Hero
0 Likes
0 Likes