Rich-text Reply

Deeper Questions About the Helper Functions

cubelodyte 04-20-16

Deeper Questions About the Helper Functions

Stop Me Before I Shoot Myself in the Foot

I'm using Code Samples provided on the Optimizely Developers site and beginning to make some fairly radical changes without a full understanding of the ramifications. 

 

URL Redirection

Variations on /* _optimizely_evaluate=force */

I've been working with Redirect Experiments and come across some areas where a little knowledge may be a dangerous thing. The first thing I'm noticing is that the code blocks for Redirects all contain a modified version of

special comment used to force code to execute immediately:

 

/* _optimizely_evaluate=force */ 
if(value = true){ 
console.log(“Action”) 
} 
/* _optimizely_evaluate=safe */ 

Some examples:

/* _optimizely_redirect=http://custom_new_path */

/* _optimizely_redirect=http://custom_add_query_param */

/* _optimizely_redirect=http://custom_new_domain */

First Question...

Assuming that "_optimizely_redirect=" is an essential string in this comment for directing Optimizely to execute immediately, how important, if at all, is the URL in these?

Is it simply a documentation element (as comments are generally intended to be) or does Optimizely uses that identifier somehow?

 

Second Question...

Does the use of one of these "_optimizely_redirect=" comment string set into motion some set of mechanics that requires the "_optly" object?

 

I ask this, because the code sample Redirect - Query parameter builds a separate "_optly" object in a process that appears, for our purposes, to be needlessly complex. I've reduced the code from:

 

/* _optimizely_redirect=http://custom_add_query_param */
var newQuery = "param=value";
if (window.location.search.indexOf(newQuery) === -1) {
	var _optly = {redir: document.createElement("a")};
	_optly.redir = {protocol: "https:" == document.location.protocol ? "https://" : "http://",
	                domain: window.location.hostname,
	                pathname: window.location.pathname
	               };
	_optly.cur = window.location.search;
	if (_optly.cur) {
	  _optly.redir.query = _optly.cur + "&" + newQuery;
	} else {
	  _optly.redir.query = "?" + newQuery;
	}
	_optly.redir.href = _optly.redir.protocol + _optly.redir.domain + _optly.redir.pathname + _optly.redir.query;
	window.location.replace(_optly.redir.href);
}

to something that simply evaluates the pre-existence of query strings and appends accordingly. This can be done with a simple string variable. In fact, it's not even necessary to excute window.location.replace because changing the location.search value causes the refresh by default. 

 

/*  _optimizely_evaluate=force  */
var newQuery = "param=value";
var curQuery = window.location.search;
if (curQuery.indexOf(newQuery) === -1) {
	if (curQuery) {
	  window.location.search += "&" + newQuery;
	} else {
	  window.location.search += "?" + newQuery;
	}
}
/*  _optimizely_evaluate=safe  */

So, unless there's a specific need for the "_optly" object, we can simplify the code by not systematically generating a new location object piece by piece. 

 

Now, upon reflection, this original code is doing all of this by creating an anchor element on the page and building an href to use in the location.replace later on. This, too appears to meet no obvious need unless Optimizely is using the element to track some sort of custom event. 

 

Final Observation

2 other clear differences with our revised code is the use of _optimizely_evaluate=force & _optimizely_evaluate=safe

and the 'if' condition to only run the refresh if the intended query string is not already present. 

 

We do this because we may want to have several variations that continue to modify page elements after the refresh.

 

Of course, if we're somehow circumventing something Optimizely needs by using the force code and not creating the '_optly' object, we need to know. 

 

 

Scott Ehly
Manager of Site Optimization
sehly@rentpath.com

'The single biggest problem with communication is the illusion that it has taken place.' - George Bernard Shaw
AllisonR 04-22-16
 

Re: Deeper Questions About the Helper Functions

Hi there,

 

Thanks for your questions!

 

Regarding the "_optimizely_redirect= http://" tag, this is essential to tell Optimizely that this is a redirect variation. You can replace the URL with an alternate string of your choice (this string displays in the pop-up in the Editor) but the http(s)-protocol is important. This tag not only tells Optimizely to evaluate the code as quickly as possible but also not to evaluate this code from within the Editor, which could cause some functionality to break.

 

With regards to the _optly object in our code samples for custom redirects, it is not required to use this variable to manipulate the window.location. We use it as a scalable way to track the different pieces of the redirect URL until it is ready to replace the visitor's window.location. It looks like in your case this is not necessary.

 

Hope this helps!

 

Best,

Allison
Sr. Technical Support Engineer
Optimizely | EMEA

 

Allison
Sr. Technical Support Engineer
Optimizely | EMEA
Optimizely