Awesome

bxnch

Dynamically generated benchmark graph service.

Usage

1. Generate your benchmark JSON file and save the output to a file.

deno bench --json > bench.json

2. Use your image in your README.

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?dark">
  <source media="(prefers-color-scheme: light)" srcset="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json">
  <img alt="Benchmark graph generated by Bxnch" src="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json">
</picture>

Change Graph Color

Add ?color={color} to the image URL. It is highly recommended to use ?dark on pages with dark backgrounds to improve visibility of the graph.

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?color=red&dark">
  <source media="(prefers-color-scheme: light)" srcset="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?color=red">
  <img alt="Benchmark graph generated by Bxnch" src="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?color=red">
</picture>

Change Graph Dimensions

Add ?width={width}&height={height} to the image URL.

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?width=500&height=500">
  <source media="(prefers-color-scheme: light)" srcset="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?width=500&height=500">
  <img alt="Benchmark graph generated by Bxnch" src="https://bxnch.deno.dev/iuioiua/bxnch/main/bench.json?width=500&height=500">
</picture>