Rich-text Reply

How to reduce JS snippet size?

szimek 11-25-16

How to reduce JS snippet size?

[ Edited ]

In Settings/Implementation page the reported snippet size is 67.23KB, which unzipped is around 200KB. We don't have any experiments running currently, one enabled integration (GA Universal) and we checked option to exclude draft and paused experiments. We do include trimmed jQuery 1.11.3.

 

On mobile devices it takes a while to download and parse all this JS code. Is there any way to further reduce the snippet size? It's just a bit smaller than React framework (about 250KB minified) and larger than Angular 1.x (about 150KB minified)...

Level 2

robertchan 11-28-16
 

Re: How to reduce JS snippet size?

There are a few ways you can reduce the snippet size. One is by archiving experiments that are not active. Another is by removing jQuery altogether from your project, however, you should still have it implemented natively then on your site.
Robert Chan

Breana_Eads 11-28-16
 

Re: How to reduce JS snippet size?

[ Edited ]

In addition to the steps mentioned above,  you can reduce snippet size by checking the box "Exclude draft and paused experiments" in the privacy tab under settings.  What this feature does, is excludes experiments that are in draft and paused states from being loaded into the snippet.  This would prevent some QA functions from working on draft and paused experiments but it is a feature you can turn on and off at will.

Breana Eads
Optimizely
RyanC 11-29-16
 

Re: How to reduce JS snippet size?

67KB is the smallest size you can get with Optimizely. You might want to look into Asynchronous loading if flashing is not an issue for you to increase your website speed. https://help.optimizely.com/Set_Up_Optimizely/Synchronous_and_Asynchronous_snippet_loading
Ryan
------------------------------------------------
The best solution is the simplest.
Level 10
szimek 11-29-16
 

Re: How to reduce JS snippet size?

Thanks everyone! Like I mentioned in my post, we already have "Exclude draft and paused experiments" option checked and we include trimmed jQuery, because our project uses React and doesn't need jQuery by itself.

It still surprises me that the smallest possible version of Optimizely with trimmed jQuery is about 200KB (67KB gzipped) - which is more than size of most JS frameworks... Optimizely without jQuery is still pretty big - almost 110KB (38KB gzipped). We'll probably investigate loading it asynchronously, but I suspect that once we add server-side rendering, flashing will be even more visible and unfortunately unacceptable.

Has anyone tried replacing trimmed jQuery with e.g. zepto (9.6KB gzipped)? Is Optimizely using jQuery in its own code, or is it only used by experiments?
Level 2