spruce up dnsdist built-in website with cache hitrate percentage (in text & graph)

diff --git a/pdns/dnsdistdist/html/index.html b/pdns/dnsdistdist/html/index.html
index 135808ee0be5643aba59d96838e8330e21a18d2e..1417c212a7bdbbba1c116228f0a2accbcd6ea20b 100644 (file)
--- a/pdns/dnsdistdist/html/index.html
+++ b/pdns/dnsdistdist/html/index.html
@@ -50,7 +50,7 @@
     </tr></table>
     <p>
       Uptime: <span id="uptime"></span>, Number of queries: <span id="questions"></span> (<span id="qps"></span> qps), ACL drops: <span id="acl-drops"></span>, Dynamic drops: <span id="dyn-drops"></span>, Rule drops: <span id="rule-drops"></span>, Blockfilter drops: <span id="blockfilter-drops"></span><br/>
-      Average response time: <span id="latency"></span> ms, CPU Usage: <span id="cpu"></span>%, Server selection policy: <span id="server-policy"></span><br/>
+      Average response time: <span id="latency"></span> ms, CPU Usage: <span id="cpu"></span>%, Cache hitrate: <span id="phitrate"></span>%, Server selection policy: <span id="server-policy"></span><br/>
       Listening on: <span id="local"></span>, ACL: <span id="acl"></span>
     </p>
     <table width="100%" cellpadding="20">
@@ -64,7 +64,7 @@
                   <div id="qpschart"></div>
                 </div>
             </td></tr>
-            <tr><td align="center">CPU %</td></tr>
+            <tr><td align="center">CACHE HITRATE / CPU %</td></tr>
             <tr><td>
                 <div class="chart_container">
                   <div id="cpuy_axis"></div>

diff --git a/pdns/dnsdistdist/html/local.js b/pdns/dnsdistdist/html/local.js
index 448b4aaf7967400975b29bed0a5d89da577c1aa8..4b20cd074f08c02762fd36ffbec343f475ebed72 100644 (file)
--- a/pdns/dnsdistdist/html/local.js
+++ b/pdns/dnsdistdist/html/local.js
@@ -30,7 +30,7 @@ $(document).ready(function() {
         width: 400,
         height: 200,
         renderer: 'line',
-        series: new Rickshaw.Series.FixedDuration([{ name: 'one' }], undefined, {
+        series: new Rickshaw.Series.FixedDuration([{ name: 'one' }, {name: 'two'}], undefined, {
             timeInterval: 1000,
             maxDataPoints: 100,
             timeBase: new Date().getTime() / 1000
@@ -151,7 +151,7 @@ $(document).ready(function() {
                 $("#rule-drops").text(data["rule-drop"]);
                $("#blockfilter-drops").text(data["block-filter"]);
                 $("#uptime").text(moment.duration(data["uptime"]*1000.0).humanize());
-                $("#latency").text((data["latency-avg100"]/1000.0).toFixed(2));
+                $("#latency").text((data["latency-avg10000"]/1000.0).toFixed(2));
                 if(!gdata["cpu-sys-msec"]) 
                     gdata=data;
 
@@ -164,16 +164,19 @@ $(document).ready(function() {
 
                 var servfailps=1.0*data["servfail-responses"]-1.0*gdata["servfail-responses"];
 
-                var totpcache=1.0*data["packetcache-hits"]-1.0*gdata["packetcache-hits"]+1.0*data["packetcache-misses"]-1.0*gdata["packetcache-misses"];
-                if(totpcache > 0)
-                    $("#phitrate").text((100.0*(data["packetcache-hits"]-1.0*gdata["packetcache-hits"])/totpcache).toFixed(2));
+                var totpcache=1.0*data["cache-hits"]-1.0*gdata["cache-hits"]+1.0*data["cache-misses"]-1.0*gdata["cache-misses"];
+                var hitrate=0;
+                if(totpcache > 0) {
+                    hitrate=100.0*(data["cache-hits"]-1.0*gdata["cache-hits"])/totpcache;
+                    $("#phitrate").text(hitrate.toFixed(2));
+                }
                 else
                     $("#phitrate").text(0);
                 
                 qpsgraph.series.addData({ qps: qps, servfailps: servfailps});
                 qpsgraph.render();
 
-                cpugraph.series.addData({ one: cpu});
+                cpugraph.series.addData({ one: cpu, two: hitrate});
                 cpugraph.render();
 
                 gdata=data;