situation is:
Javascript boomerang.js used as test of client net speed, problem is that html content is executed by browser and is not waiting for boomerang result. But boomerang result is needed because there are some changes in html content.
How it is possible to do not execute html content before boomernag.js has result?
EDIT: after little googling there is no possibility to prevent browser to not load html content before javascript finished, becuase boomerang do not block this content, even we set autorun: false in BOOMR.init and than call it by BOOMR.page_ready(); in any place. It is native javascript asynchronous behaviour.
So we CAN NOT use following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel='stylesheet' type='text/css' media='all' href='css/style.css' />
<link rel='stylesheet' type='text/css' media='all' href='css/colorbox.css' />
<script type="text/javascript" src="js/speedtest/boomerang.min.js"></script>
<script>
BOOMR.init({ beacon_url: "http://www.zzz.xx", user_ip: '10.0.0.1', site_domain: "http://www.zzz.xx", BW: { nruns: 3, base_url: 'http://www.zzz.xx/test_images/', cookie: 'SPEED-test'}});
</script>
<script type="text/javascript" src="js/preload.js"></script>
preload.js is just check cookies and if exist do not make test again, if does not, run speedtest by BOOMR.subscribe
function getCookie(cname)
{
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
var c = ca[i].trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return "";
}
var version_set=getCookie("speedtest_version_set");
if (version_set == "low"){
$(document).ready(website_init_low);
} else if (version_set == "high"){
$(document).ready(website_init_high);
} else {
BOOMR.subscribe('before_beacon', function(o) {
if(o.bw) {
netspeed = Math.abs(parseInt(o.bw*8/1024));
var netspeed_limit = 5000;
if (netspeed < netspeed_limit) {
document.cookie="speedtest_version_set = low";
$(document).ready(website_init_low);
} else {
document.cookie="speedtest_version_set = high";
$(document).ready(website_init_high);
}
}
});
}
The only what we can do is make separate index.php file and than call index_low.html or index_high.html as follows:
<?php
echo "<script type='text/javascript' src='js/speedtest/boomerang.min.js'></script>";
echo "<script type='text/javascript' src='js/speedtest/bw.js'></script>";
echo "<script type='text/javascript'>BOOMR.init({ beacon_url: 'xxx', user_ip: '10.0.0.1', site_domain: 'xxxxxx', autorun: false, BW: { nruns: 3, base_url: 'js/speedtest/test_images/', cookie: 'xxxxx'}})</script>";
echo "<script type='text/javascript'>
function getCookie(cname) //read cookie by javascript
{
var name = cname + '=';
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++)
{
if(typeof String.prototype.trim !== 'function') { //IE bug fix -IE not support trim();
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, '');
}
}
var c = ca[i].trim(); //IE bug fix -IE not support trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return '';
}
var netspeed;
var netspeed_limit = 5000;
var version_set=getCookie('speedtest_version_set');
if (version_set == 'low'){
window.location = 'index_low.html'
} else if (version_set == 'high'){
window.location = 'index_hight.html'
} else{
BOOMR.page_ready(); //fire BOOMR only from this place
BOOMR.subscribe('before_beacon', function(o) {
if(o.bw) {
netspeed = Math.abs(parseInt(o.bw*8/1024));
if (netspeed < netspeed_limit) {
document.cookie='speedtest_version_set = low';
window.location = 'index_low.html'
} else {
document.cookie='speedtest_version_set = high';
window.location = 'index_high.html'
}
}
});
}
</script>";
?>
And of course much better is to check cookies by $_COOKIE variable in PHP, not by javascript.
This question was answered on the boomerang issues page here: https://github.com/lognormal/boomerang/issues/27