Add HTTP HEAD results. CheckerNetwork/spark-checker#104 (#29)

* add `successful_http_head`. CheckerNetwork/spark-checker#104

* rename metric

* fix line

* fmt

* add tip

Author: juliangruber

src/components/histogram.js

@@ -12,6 +12,12 @@ export function Histogram(events, { width, title, thresholds }) {
     if (d.success_rate_http != null) {
       res.push({ type: 'HTTP only', value: d.success_rate_http * 100 })
     }
+    if (d.success_rate_http_head != null) {
+      res.push({
+        type: 'HTTP only w/ HEAD',
+        value: d.success_rate_http_head * 100,
+      })
+    }
     return res
   })
 

src/components/line-graph.js

@@ -21,6 +21,11 @@ export function LineGraph(
       success_rate_http: event.success_rate_http,
       type: 'HTTP only',
     })),
+    ...filteredEvents.map((event) => ({
+      day: event.day,
+      success_rate_http_head: event.success_rate_http_head,
+      type: 'HTTP only w/ HEAD',
+    })),
   ]
 
   // Format functions for tooltip values
@@ -72,6 +77,19 @@ export function LineGraph(
           },
         },
       }),
+      Plot.lineY(combinedData, {
+        x: 'day',
+        y: 'success_rate_http_head',
+        stroke: 'type',
+        curve: 'linear',
+        tip: {
+          format: {
+            x: formatDate,
+            y: formatPercent,
+            type: true,
+          },
+        },
+      }),
     ],
   })
 }

src/index.md

@@ -50,6 +50,7 @@ const tidySparkMinerRates = SparkMinerRates.sort(
     ttfb_ms,
     success_rate: `${(record.success_rate * 100).toFixed(2)}%`,
     success_rate_http: `${(record.success_rate_http * 100).toFixed(2)}%`,
+    success_rate_http_head: `${(record.success_rate_http_head * 100).toFixed(2)}%`,
   }
 })
 const tidySparkClientRates = SparkClientRates.sort(
@@ -104,7 +105,7 @@ const end = view(Inputs.date({ label: 'End', value: getDateXDaysAgo(1) }))
     resize((width) => Histogram(SparkMinerRates, { width, title: "Retrieval Success Rate Buckets", thresholds: 10 }))
   }</div>
   <div class="card">${
-    resize((width) => Histogram(nonZeroSparkMinerRates.map((record) => ({success_rate: record.success_rate, success_rate_http: record.success_rate_http? record.success_rate_http: null})), { width, title: "Non-zero Miners: Retrieval Success Rate Buckets", thresholds: 10 }))
+    resize((width) => Histogram(nonZeroSparkMinerRates.map((record) => ({success_rate: record.success_rate, success_rate_http: record.success_rate_http? record.success_rate_http: null, success_rate_http_head: record.success_rate_http_head? record.success_rate_http_head: null})), { width, title: "Non-zero Miners: Retrieval Success Rate Buckets", thresholds: 10 }))
   }</div>
 </div>
 
@@ -135,6 +136,18 @@ const nonZeroMinersOverTime = Object.entries(SparkMinerRsrSummaries).flatMap(
         : null,
       type: 'HTTP only',
     },
+    {
+      day: new Date(day),
+      count_succes_rate_http_head: miners.some(
+        (m) => m.success_rate_http_head != null,
+      )
+        ? countAbove(
+            miners.map((m) => m.success_rate_http_head),
+            0,
+          )
+        : null,
+      type: 'HTTP only w/ HEAD',
+    },
   ],
 )
 const percentiles = Object.entries(SparkMinerRsrSummaries).flatMap(