Download Free: A\/B Testing Guide<\/em><\/span><\/a><\/h2>\n\n\nSub-optimal Test Configuration with ‘DOM Ready’ Event Conditions<\/h2>\n\n\n
In the research conducted by OrangeValley, the test campaign was configured with sub-optimal settings within VWO. This means that rather than using the recommended WYSIWYG Visual Editor<\/a> to change background image and text, a custom JavaScript code was used to make the changes. In addition, the code was configured to fire after the page had loaded (in JavaScript this is called a \u2018DOM ready\u2019 event). This impacted the result in two ways:<\/p>\n\n\n\n\n- The inclusion of the \u2018DOM ready\u2019 event made the VWO code wait for the entire page to load before it could display the changes made in the variation. The web page used in the study had a page load time of around 2.7 seconds<\/a>.
Here’s a snapshot of the campaign code from VWO settings (while the code waits for ‘DOM ready’):![\"Sub-optimal](\"https:\/\/static.wingify.com\/vwo\/uploads\/sites\/3\/2016\/05\/Screenshot-2016-05-20-23.25.27.png\")
Here’s another snapshot of the campaign code (using the optimal way, without ‘DOM ready’): ![\"Optimal](\"https:\/\/static.wingify.com\/vwo\/uploads\/sites\/3\/2016\/05\/Screenshot-2016-05-20-23.32.17.png\")
Executing after the DOM ready event will invariably increase the experienced loading time. Here\u2019s the general case for it.<\/li>\n\n\n\n- To counter flicker and ensure a smooth loading experience for visitors, VWO hides all the relevant elements before they start loading on the page and only unhides them once the VWO Smartcode<\/a> has swapped them with the variation changes. All this happens within a span of 110 milliseconds on average. If the campaign had been configured using the optimal manner, the flicker effect would have automatically been taken care of by the VWO Smartcode.<\/li>\n<\/ol>\n\n\n
Asynchronous v\/s Synchronous Code<\/h2>\n\n\n
As clearly noted, “Most A\/B testing software<\/a> create an additional step in loading and rendering a web page”.
This happens because many A\/B testing tools use synchronous code. VWO, with its asynchronous VWO Smartcode is an exception to this.<\/p>\n\n\n\nWith its unique asynchronous code, VWO ensures there is no delay in the load time of the page. The VWO Asynchronous Smartcode does not block the rendering of parts of the page and does not impact the page load time.<\/p>\n\n\n
\n![\"Asynchronous](\"https:\/\/static.wingify.com\/vwo\/uploads\/sites\/3\/2016\/05\/stats1-copy.jpg\")
<\/figure>\n<\/div>\n\n\nWhat is asynchronous code and why does VWO recommend it?<\/strong><\/p>\n\n\n\nSimply put, asynchronous means that the code will contact VWO’s servers in the background, download and process the test package while the rest of your page continues to load and render in the browser normally.<\/p>\n\n\n\n
With synchronous code, the browser has to wait for the package to download and then process it before loading the rest of the page. If for any reason the tracking code can\u2019t contact its servers then the browser will wait, usually for 30 to 60 seconds, until the request times out. If your tracking code is in the tag, then your entire page won\u2019t load and your visitor will be stuck with a blank page. Asynchronous code does not have this critical problem. If for any reason, the asynchronous VWO Smartcode can\u2019t contact our servers your page will still download and render properly.<\/p>\n\n\n
Private and Dynamic Content Delivery Network (CDN)<\/h2>\n\n\n
VWO has invested years of engineering effort to ensure that we build the best-in-class technology and infrastructure for our customers. Our CDN runs using a Global Load Balancer, deployed in Google Cloud Platform (GCP), and the backend servers are spread across 14 locations<\/a>. This ensures that we always have a server close to your visitor\u2019s location and there is minimum latency, reducing critical download time.<\/p>\n\n\n\n![\"VWO](\"https:\/\/static.wingify.com\/vwo\/uploads\/sites\/3\/2016\/05\/vwo-cdn-1.jpg\")
<\/figure>\n<\/div>\n\n\nVWO\u2019s CDN is also dynamic which caches not just the static code required to run tests but also generates dynamic test variation data. This has an edge over regular CDNs since they only cache static data. By dynamically generating test packages only the relevant variation data is sent to each visitor depending on the URL they are on.<\/p>\n\n\n\n
Download Free: A\/B Testing Guide<\/em><\/span><\/a><\/h2>\n\n\nSmall Size of VWO\u2019s Test Packages<\/h2>\n\n\n
Another factor that significantly impacts page load time is the size of test packages, which determines how long it will take for the browser to download it. VWO ensures small package sizes through two methods: by intelligently understanding and recording only the precise changes that you make to your page, and individually packaging tests for a visitor to deliver only the relevant content for the URL they are on.<\/p>\n\n\n\n
Let us suppose you edit the HTML of your product page template to make two changes; increase the font-size of your text and insert a \u2018recommended\u2019 icon. VWO compares your changes to the original code and detects the precise edits – the change made to the CSS property \u201cfont-size\u201d and the insertion of a new graphic. Other systems will save the entire block of code which will also convert the dynamic content<\/a> into static content and will end up showing the same description across all product pages.<\/p>\n\n\n
- \n
- The inclusion of the \u2018DOM ready\u2019 event made the VWO code wait for the entire page to load before it could display the changes made in the variation. The web page used in the study had a page load time of around 2.7 seconds<\/a>.
Here’s a snapshot of the campaign code from VWO settings (while the code waits for ‘DOM ready’):
Here’s another snapshot of the campaign code (using the optimal way, without ‘DOM ready’):
Executing after the DOM ready event will invariably increase the experienced loading time. Here\u2019s the general case for it.<\/li>\n\n\n\n- To counter flicker and ensure a smooth loading experience for visitors, VWO hides all the relevant elements before they start loading on the page and only unhides them once the VWO Smartcode<\/a> has swapped them with the variation changes. All this happens within a span of 110 milliseconds on average. If the campaign had been configured using the optimal manner, the flicker effect would have automatically been taken care of by the VWO Smartcode.<\/li>\n<\/ol>\n\n\n
Asynchronous v\/s Synchronous Code<\/h2>\n\n\n
As clearly noted, “Most A\/B testing software<\/a> create an additional step in loading and rendering a web page”.
This happens because many A\/B testing tools use synchronous code. VWO, with its asynchronous VWO Smartcode is an exception to this.<\/p>\n\n\n\nWith its unique asynchronous code, VWO ensures there is no delay in the load time of the page. The VWO Asynchronous Smartcode does not block the rendering of parts of the page and does not impact the page load time.<\/p>\n\n\n
\n<\/figure>\n<\/div>\n\n\nWhat is asynchronous code and why does VWO recommend it?<\/strong><\/p>\n\n\n\n
Simply put, asynchronous means that the code will contact VWO’s servers in the background, download and process the test package while the rest of your page continues to load and render in the browser normally.<\/p>\n\n\n\n
With synchronous code, the browser has to wait for the package to download and then process it before loading the rest of the page. If for any reason the tracking code can\u2019t contact its servers then the browser will wait, usually for 30 to 60 seconds, until the request times out. If your tracking code is in the tag, then your entire page won\u2019t load and your visitor will be stuck with a blank page. Asynchronous code does not have this critical problem. If for any reason, the asynchronous VWO Smartcode can\u2019t contact our servers your page will still download and render properly.<\/p>\n\n\n
Private and Dynamic Content Delivery Network (CDN)<\/h2>\n\n\n
VWO has invested years of engineering effort to ensure that we build the best-in-class technology and infrastructure for our customers. Our CDN runs using a Global Load Balancer, deployed in Google Cloud Platform (GCP), and the backend servers are spread across 14 locations<\/a>. This ensures that we always have a server close to your visitor\u2019s location and there is minimum latency, reducing critical download time.<\/p>\n\n\n
\n<\/figure>\n<\/div>\n\n\nVWO\u2019s CDN is also dynamic which caches not just the static code required to run tests but also generates dynamic test variation data. This has an edge over regular CDNs since they only cache static data. By dynamically generating test packages only the relevant variation data is sent to each visitor depending on the URL they are on.<\/p>\n\n\n\n
Download Free: A\/B Testing Guide<\/em><\/span><\/a><\/h2>\n\n\n
Small Size of VWO\u2019s Test Packages<\/h2>\n\n\n
Another factor that significantly impacts page load time is the size of test packages, which determines how long it will take for the browser to download it. VWO ensures small package sizes through two methods: by intelligently understanding and recording only the precise changes that you make to your page, and individually packaging tests for a visitor to deliver only the relevant content for the URL they are on.<\/p>\n\n\n\n
Let us suppose you edit the HTML of your product page template to make two changes; increase the font-size of your text and insert a \u2018recommended\u2019 icon. VWO compares your changes to the original code and detects the precise edits – the change made to the CSS property \u201cfont-size\u201d and the insertion of a new graphic. Other systems will save the entire block of code which will also convert the dynamic content<\/a> into static content and will end up showing the same description across all product pages.<\/p>\n\n\n
- To counter flicker and ensure a smooth loading experience for visitors, VWO hides all the relevant elements before they start loading on the page and only unhides them once the VWO Smartcode<\/a> has swapped them with the variation changes. All this happens within a span of 110 milliseconds on average. If the campaign had been configured using the optimal manner, the flicker effect would have automatically been taken care of by the VWO Smartcode.<\/li>\n<\/ol>\n\n\n
![\"Small](\"https:\/\/static.wingify.com\/vwo\/uploads\/sites\/3\/2016\/05\/img_code.jpg\")
<\/figure>\n<\/div>\n\n\n![\"VWO](\"https:\/\/static.wingify.com\/vwo\/uploads\/sites\/3\/2016\/05\/stats3-3-copy.jpg\")
<\/figure>\n<\/div>\n\n\n