Menu

Lumen help

Monitoring tools for Web

Debug tools for Web

Once you have set up Mesh Delivery and configured it as per your needs, naturally you would want to see if it is working and how well it is performing. You'd also want to test any changes before deploying them to production. We have developed a suite of debugging tools to help you with this:

 

Mesh Delivery graph

A Mesh Delivery graph can be added to and shown on any page that is running our technology. The graph provides you with information about how much of the stream is being provided via the CDN versus via Mesh Delivery (1). It also allows you to see the number of users you are connected to (2) and how many megabytes are uploaded from your device to other users (3). On the right-hand side, you can see an offload percentage, which corresponds to the percentage of data that has been sourced from the peer network (4). You can simulate new users locally for testing purposes by clicking on the "simulate a user" button (5).

Mesh Delivery graph

Integrate the graph within your test page
 

To include the Mesh Delivery graph in your test page, add the following HTML code.
 

In the <head> tag

                <head>
    <script src="//tools.streamroot.io/usage-graphs/stable/graphs.js"></script>
</head>

In the <body> tag

                <body>
    <div id="streamroot-graphs"></div>
</body>

If you see an error message, please visit this FAQ article.

Mesh Delivery graph bookmarklet

To activate the Mesh Delivery graph on any page, add a bookmarklet in your browser.
 

Bookmarklet code

                javascript:(function(){var t=document.getElementById("streamroot-graphs");if(t)t.remove(),document.getElementById("streamroot-graphs-script").remove();else{var e=document.createElement("script");t=document.createElement("div"),e.src="https://tools.streamroot.io/usage-graphs/latest/graphs.js",e.setAttribute("id","streamroot-graphs-script"),t.setAttribute("id","streamroot-graphs"),t.style.padding="10px",t.style.position="fixed",t.style.bottom="0%",t.style.width="100%",t.style.zIndex="2147483647",document.body.appendChild(e),document.body.appendChild(t)}})();

To add the bookmarklet in Chrome:

 

  • Go to you bookmark manager: chrome://bookmarks/

  • Right click on the list and select Add Page.

  • Then enter a name for you bookmarklet in the first input, copy paste the bookmarklet code in the second one.

  • Save it, and you're set!

If you see an error message, please visit this FAQ article.

Mesh Delivery stats in console logs

To display basic Mesh Delivery stats in your browser, copy paste the following snippet:

                javascript:!function(){function n(){if(Streamroot.instances.length){var n=Streamroot.instances[0].stats,t=n.allContents.dnaDownload?n.allContents.dnaDownload/(n.allContents.dnaDownload+n.allContents.cdnDownload)*100:0,a={upload:o(n.allContents.dnaUpload),dna:o(n.allContents.dnaDownload),cdn:o(n.allContents.cdnDownload),efficiency:`${t}%`,peers:n.realtime.dnaSources};console.table(a)}else console.warn("Streamrooot not initialized")}function o(n,o=10){if(0===n)return"0B";var t=o+1||1,a=Math.floor(Math.log(n)/Math.log(1e3));return parseFloat((n/1e3**a).toFixed(t))+["B","KB","MB","GB","TB","PB","EB","ZB","YB"][a]}setInterval(()=>{n()},1e4),n()}();
Mesh Delivery stats on browser console