erikfried/BoomerangVelvetMetrics.html

## README.markdown

      
    Raw
  

              README.markdown
            
          
    Connecting Boomerang with VelvetMetrics with a BOOMR plugin


## BoomerangVelvetMetrics.html
<!DOCTYPE html>
<html>
<head>
    <title>Velvet test with BOOMR</title>
</head>
<body>
<h1>Testing roundtrip time</h1>
<p>Using <a href="http://developer.yahoo.com/blogs/ydn/posts/2010/06/performance_testing_with_boomerang/">Boomerang</a> and <a href="http://www.velvetmetrics.com/">velvetmetrics</a></p>
<p id="results"></p>
<img src="http://www.velvetmetrics.com/chart?&path=random.path.3yb8s&groupBy=10min&f=avg&datapoints=true&title=true&axes=true&legends=true&customtitle=Avg%20roundtrip%20time%20/10%20mins&w=600&h=250&output=image&rand=2612" alt="loadtime history"/>

<script type="text/javascript" src="http://yourjavascript.com/132291371/boomerang.js"></script> <!--download from:  https://github.com/yahoo/boomerang -->
<script type="text/javascript">
    (function () {
        var
            //Remove all params that would otherwise show up in beacon url for no good.
                removeBoomrDefaultParams = function (o) {
                    var k;
                    for (k in o) {
                        console.log(k);
                        if (o.hasOwnProperty(k)) {
                            BOOMR.removeVar(k);
                        }
                    }
                },
            //Add meaningful params for the velvetmetrics beacon server api.
                addVmParams = function (value) {
                    BOOMR.addVar("path", 'random.path.3yb8s'); // This one should not be hard-coded in any real usage of this!
                    BOOMR.addVar("power", value);
                    BOOMR.addVar("output", "image");
                };

        //Init the boomerang magic. Disabling bandwidth test for this simple poc.
        BOOMR.init({
            user_ip: "127.0.0.1",
            beacon_url: "http://www.velvetmetrics.com/log",
            BW : { enabled : false }
        });

        //Hijack action before beacon is requested and transform query parameters
        //to something maningful for our beacon service api.
        //For this test we are only measuring page roundtripTime
        BOOMR.subscribe('before_beacon', function(o) {
            var roundtripTime = o["t_done"];
            removeBoomrDefaultParams(o);
            addVmParams(roundtripTime);
            document.getElementById("results").innerText = 'Page load time was ' + roundtripTime + ' millis';
        });
    })();
</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Velvet test with BOOMR</title>
	</head>
	<body>
	<h1>Testing roundtrip time</h1>
	<p>Using <a href="http://developer.yahoo.com/blogs/ydn/posts/2010/06/performance_testing_with_boomerang/">Boomerang</a> and <a href="http://www.velvetmetrics.com/">velvetmetrics</a></p>
	<p id="results"></p>
	<img src="http://www.velvetmetrics.com/chart?&path=random.path.3yb8s&groupBy=10min&f=avg&datapoints=true&title=true&axes=true&legends=true&customtitle=Avg%20roundtrip%20time%20/10%20mins&w=600&h=250&output=image&rand=2612" alt="loadtime history"/>

	<script type="text/javascript" src="http://yourjavascript.com/132291371/boomerang.js"></script> <!--download from: https://github.com/yahoo/boomerang -->
	<script type="text/javascript">
	(function () {
	var
	//Remove all params that would otherwise show up in beacon url for no good.
	removeBoomrDefaultParams = function (o) {
	var k;
	for (k in o) {
	console.log(k);
	if (o.hasOwnProperty(k)) {
	BOOMR.removeVar(k);
	}
	}
	},
	//Add meaningful params for the velvetmetrics beacon server api.
	addVmParams = function (value) {
	BOOMR.addVar("path", 'random.path.3yb8s'); // This one should not be hard-coded in any real usage of this!
	BOOMR.addVar("power", value);
	BOOMR.addVar("output", "image");
	};

	//Init the boomerang magic. Disabling bandwidth test for this simple poc.
	BOOMR.init({
	user_ip: "127.0.0.1",
	beacon_url: "http://www.velvetmetrics.com/log",
	BW : { enabled : false }
	});

	//Hijack action before beacon is requested and transform query parameters
	//to something maningful for our beacon service api.
	//For this test we are only measuring page roundtripTime
	BOOMR.subscribe('before_beacon', function(o) {
	var roundtripTime = o["t_done"];
	removeBoomrDefaultParams(o);
	addVmParams(roundtripTime);
	document.getElementById("results").innerText = 'Page load time was ' + roundtripTime + ' millis';
	});
	})();
	</script>
	</body>
	</html>