improve bar graphs
3 changed files+77−83
README.mdmodified+3−15View file
@@ -1,9 +1,11 @@
11 # benchcompress
22
3-A benchmarking framework for evaluating compression algorithms on data arrays, with a focus on scientific data.
3+A benchmarking framework for evaluating compression algorithms on scientific data arrays.
44
55 Latest benchmark results: https://magland.github.io/benchcompress/
66
7+Paper (WIP): https://magland.github.io/benchcompress/paper
8+
79 ## Overview
810
911 Benchcompress is a comprehensive benchmarking framework for evaluating compression algorithms on scientific data arrays. The system follows an automated workflow:
@@ -82,17 +84,3 @@ pre-commit install
8284 ```
8385
8486 After this setup, code will be automatically formatted when you make a commit.
85-
86-# Theory
87-
88-For independently and identically distributed (i.i.d.) discrete data, where each sample is drawn from a discrete probability distribution (e.g., Bernoulli sampling or quantized Gaussian noise), the theoretical compression ratio is determined by the Shannon entropy formula:
89-$$
90-H(X) = -\sum_{i} p(x_i) \log p(x_i).
91-$$
92-Here, $p(x_i)$ represents the probability of occurrence of the $i$-th symbol $x_i$ in the discrete distribution.
93-
94-In practice, achieving this theoretical compression ratio often requires sophisticated encoding techniques. While arithmetic encoding provides one such method, it is challenging to implement and can be computationally inefficient. A more modern and efficient alternative is Asymmetric Numeric Systems (ANS), which closely approaches the theoretical limit and is incorporated into state-of-the-art compressors such as ZStandard. However, these algorithms are primarily optimized for structured data types, such as text, rather than for floating point or integer arrays.
95-
96-In our benchmarks, we evaluate a simple implementation of ANS using a Python package we developed, called \texttt{simple\_ans}. As anticipated, ANS demonstrates superior performance when compressing i.i.d. samples from a discrete distribution. However, its efficiency diminishes when handling more structured data, such as continuous signals (e.g., voltage traces in electrophysiology).
97-
98-Applying delta encoding partially mitigates this limitation by leveraging the continuity properties of the data through differencing. This preprocessing step enhances ANS performance, though it still falls short of the compression achieved by methods like ZStandard. Additional preprocessing techniques, such as linear Markov predictive modeling (where the residual error after prediction is compressed instead of the original signal), further improve ANS performance. In these scenarios, the residual data is smaller and exhibits reduced correlation, enabling ANS to achieve better compression results relative to other methods.
paper/paper.mdmodified+1−1View file
@@ -4,7 +4,7 @@
44
55 *Last updated: January 2025*
66
7-**This is a draft paper, work in progress.**
7+**Early draft, work in progress.**
88
99 ## Abstract
1010
web-ui/src/components/benchmark/charts/BenchmarkCharts.tsxmodified+73−67View file
@@ -1,6 +1,51 @@
11 import Plot from "react-plotly.js";
22 import { useState } from "react";
33
4+interface BenchmarkBarChartProps {
5+ title: string;
6+ data: ChartData[];
7+ dataKey: keyof Pick<
8+ ChartData,
9+ "compression_ratio" | "encode_speed" | "decode_speed"
10+ >;
11+ color: string;
12+ xAxisTitle: string;
13+}
14+
15+function BenchmarkBarChart({
16+ title,
17+ data,
18+ dataKey,
19+ color,
20+ xAxisTitle,
21+}: BenchmarkBarChartProps) {
22+ return (
23+ <div style={{ margin: "0 20px 20px 0" }}>
24+ <h3 style={{ marginBottom: "10px" }}>{title}</h3>
25+ <Plot
26+ data={[
27+ {
28+ type: "bar",
29+ orientation: "h",
30+ y: data.map((d) => d.algorithm),
31+ x: data.map((d) => d[dataKey]),
32+ marker: { color },
33+ },
34+ ]}
35+ layout={{
36+ width: 700,
37+ height: Math.max(300, data.length * 23 + 40),
38+ margin: { t: 5, r: 30, l: 200, b: 30 },
39+ xaxis: { title: xAxisTitle },
40+ yaxis: { automargin: true, ticksuffix: " " },
41+ dragmode: false,
42+ }}
43+ config={{ displayModeBar: false }}
44+ />
45+ </div>
46+ );
47+}
48+
449 interface ChartData {
550 algorithm: string;
651 compression_ratio: number;
@@ -33,73 +78,34 @@ export function BenchmarkCharts({ chartData }: BenchmarkChartsProps) {
3378 Sort by compression ratio
3479 </label>
3580 </div>
36- <div style={{ marginBottom: "30px" }}>
37- <div style={{ marginBottom: "20px" }}>
38- <h3 style={{ marginBottom: "10px" }}>Compression Ratio</h3>
39- <Plot
40- data={[
41- {
42- type: "bar",
43- orientation: "h",
44- y: sortedData.map((d) => d.algorithm),
45- x: sortedData.map((d) => d.compression_ratio),
46- marker: { color: "#8884d8" },
47- },
48- ]}
49- layout={{
50- width: 800,
51- // important not to specify height to allow it to be based on content
52- margin: { t: 5, r: 30, l: 250, b: 30 },
53- xaxis: { title: "Ratio" },
54- dragmode: false,
55- }}
56- config={{ displayModeBar: false }}
57- />
58- </div>
59-
60- <div style={{ marginBottom: "20px" }}>
61- <h3 style={{ marginBottom: "10px" }}>Encode Speed (MB/s)</h3>
62- <Plot
63- data={[
64- {
65- type: "bar",
66- orientation: "h",
67- y: sortedData.map((d) => d.algorithm),
68- x: sortedData.map((d) => d.encode_speed),
69- marker: { color: "#82ca9d" },
70- },
71- ]}
72- layout={{
73- width: 800,
74- // important not to specify height to allow it to be based on content
75- margin: { t: 5, r: 30, l: 250, b: 30 },
76- xaxis: { title: "MB/s" },
77- }}
78- config={{ displayModeBar: false }}
79- />
80- </div>
81-
82- <div style={{ marginBottom: "20px" }}>
83- <h3 style={{ marginBottom: "10px" }}>Decode Speed (MB/s)</h3>
84- <Plot
85- data={[
86- {
87- type: "bar",
88- orientation: "h",
89- y: sortedData.map((d) => d.algorithm),
90- x: sortedData.map((d) => d.decode_speed),
91- marker: { color: "#ff7300" },
92- },
93- ]}
94- layout={{
95- width: 800,
96- // important not to specify height to allow it to be based on content
97- margin: { t: 5, r: 30, l: 250, b: 30 },
98- xaxis: { title: "MB/s" },
99- }}
100- config={{ displayModeBar: false }}
101- />
102- </div>
81+ <div
82+ style={{
83+ display: "flex",
84+ flexWrap: "wrap",
85+ gap: "20px",
86+ }}
87+ >
88+ <BenchmarkBarChart
89+ title="Compression Ratio"
90+ data={sortedData}
91+ dataKey="compression_ratio"
92+ color="#8884d8"
93+ xAxisTitle="Ratio"
94+ />
95+ <BenchmarkBarChart
96+ title="Encode Speed (MB/s)"
97+ data={sortedData}
98+ dataKey="encode_speed"
99+ color="#82ca9d"
100+ xAxisTitle="MB/s"
101+ />
102+ <BenchmarkBarChart
103+ title="Decode Speed (MB/s)"
104+ data={sortedData}
105+ dataKey="decode_speed"
106+ color="#ff7300"
107+ xAxisTitle="MB/s"
108+ />
103109 </div>
104110 </div>
105111 );