/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
submit instructions
Jeremy Magland <jmagland@flatironinstitute.org> committed commit eba16486c60f parent 380af32 Browse files
7 changed files+256−79
web-ui/src/App.tsxmodified+5−5View file
@@ -5,9 +5,9 @@ import { ScrollToTop } from "./components/ScrollToTop";
55 import "./components/AppHeader.css";
66 import Home from "./pages/Home";
77 import BenchmarkView from "./pages/BenchmarkView";
8-import About from "./pages/About";
98 import Paper from "./pages/Paper";
109 import Monitor from "./pages/Monitor";
10+import Submit from "./pages/Submit";
1111 import { BenchmarkData } from "./types";
1212
1313 function App() {
@@ -40,7 +40,7 @@ function App() {
4040 }, []);
4141
4242 return (
43- <BrowserRouter basename="/benchcompress">
43+ <BrowserRouter basename="/benchcompress/">
4444 <ScrollToTop />
4545 <div
4646 style={{
@@ -154,14 +154,14 @@ function App() {
154154 Monitor
155155 </Link>
156156 <Link
157- to="/about"
157+ to="/submit"
158158 style={{
159159 color: "#0066cc",
160160 textDecoration: "none",
161161 fontWeight: "500",
162162 }}
163163 >
164- About
164+ Submit
165165 </Link>
166166 </div>
167167 </div>
@@ -190,9 +190,9 @@ function App() {
190190 path="/algorithm/:algorithmName"
191191 element={<BenchmarkView benchmarkData={benchmarkData} />}
192192 />
193- <Route path="/about" element={<About />} />
194193 <Route path="/paper" element={<Paper />} />
195194 <Route path="/monitor" element={<Monitor />} />
195+ <Route path="/submit" element={<Submit />} />
196196 </Routes>
197197 )}
198198 </main>
web-ui/src/content/home-content.ymlmodified+10−1View file
@@ -26,7 +26,7 @@ sections:
2626 title: Research Paper
2727 description:
2828 Read the work-in-progress paper describing the methodology,
29- implementation, and findings of this compression benchmarking research.
29+ implementation, and findings of this research.
3030 link: /paper
3131 linkText: Read Paper
3232
@@ -47,3 +47,12 @@ sections:
4747 link: https://github.com/magland/benchcompress
4848 linkText: View on GitHub
4949 external: true
50+
51+ submit:
52+ title: Submit an Algorithm or Dataset
53+ description:
54+ Want to contribute? Learn how to add your own compression algorithm
55+ or scientific dataset to the benchmark suite. Follow the step-by-step
56+ guide for preparing and submitting your contribution.
57+ link: /submit
58+ linkText: Submission Guide
web-ui/src/pages/About.tsxdeleted+0−63View file
@@ -1,63 +0,0 @@
1-import React from "react";
2-import ReactMarkdown from "react-markdown";
3-import { useMarkdownPosts } from "../hooks/useMarkdownPosts";
4-
5-const About: React.FC = () => {
6- const { posts, error, loading } = useMarkdownPosts("posts");
7-
8- return (
9- <div style={{ maxWidth: "800px", margin: "0 auto" }}>
10- <h1>About Benchcompress</h1>
11-
12- <p
13- style={{ fontSize: "1.1rem", lineHeight: "1.6", marginBottom: "2rem" }}
14- >
15- Benchcompress is a benchmarking framework for evaluating compression
16- algorithms on data arrays, with a focus on scientific data. It measures
17- compression ratios and performance metrics across various algorithms and
18- datasets.
19- </p>
20-
21- <p>
22- <a
23- href="https://github.com/magland/benchcompress"
24- target="_blank"
25- rel="noopener noreferrer"
26- style={{ color: "#0066cc" }}
27- >
28- View on GitHub
29- </a>
30- </p>
31-
32- <hr />
33-
34- {error ? (
35- <div style={{ color: "red" }}>Error loading content: {error}</div>
36- ) : loading ? (
37- <div>Loading...</div>
38- ) : (
39- <div>
40- {posts.map((post) => (
41- <div
42- key={post.path}
43- className="markdown-content"
44- style={{ marginBottom: "2rem" }}
45- >
46- <div style={{ color: "#666", marginBottom: "1rem" }}>
47- {post.date.toLocaleDateString("en-US", {
48- year: "numeric",
49- month: "long",
50- day: "numeric",
51- })}
52- </div>
53- <ReactMarkdown>{post.content}</ReactMarkdown>
54- {post.path !== posts[posts.length - 1].path && <hr />}
55- </div>
56- ))}
57- </div>
58- )}
59- </div>
60- );
61-};
62-
63-export default About;
web-ui/src/pages/Home.tsxmodified+83−9View file
@@ -1,4 +1,5 @@
1-import React from "react";
1+import React, { useEffect, useState } from "react";
2+import axios from "axios";
23 import { Link } from "react-router-dom";
34 import yaml from "yaml";
45 import contentYaml from "../content/home-content.yml?raw";
@@ -12,19 +13,25 @@ const SectionCard: React.FC<{ section: HomeSection }> = ({ section }) => {
1213 return (
1314 <div
1415 style={{
15- padding: "1.5rem",
16+ padding: "0.75rem",
1617 border: "1px solid #eaeaea",
1718 borderRadius: "8px",
1819 backgroundColor: "#f9f9f9",
20+ display: "flex",
21+ flexDirection: "column",
22+ height: "100%",
1923 }}
2024 >
21- <h2 style={{ marginBottom: "1rem" }}>{section.title}</h2>
22- <p style={{ marginBottom: "1rem" }}>{section.description}</p>
25+ <h2 style={{ fontSize: "1.25rem", marginBottom: "0.5rem" }}>
26+ {section.title}
27+ </h2>
28+ <p style={{ marginBottom: "0.5rem" }}>{section.description}</p>
2329 <a
2430 href={section.link}
2531 target="_blank"
2632 rel="noopener noreferrer"
2733 className="soft-button"
34+ style={{ marginTop: "auto", alignSelf: "flex-start" }}
2835 >
2936 {section.linkText}
3037 </a>
@@ -35,22 +42,66 @@ const SectionCard: React.FC<{ section: HomeSection }> = ({ section }) => {
3542 return (
3643 <div
3744 style={{
38- padding: "1.5rem",
45+ padding: "0.75rem",
3946 border: "1px solid #eaeaea",
4047 borderRadius: "8px",
4148 backgroundColor: "#f9f9f9",
49+ display: "flex",
50+ flexDirection: "column",
51+ height: "100%",
4252 }}
4353 >
44- <h2 style={{ marginBottom: "1rem" }}>{section.title}</h2>
45- <p style={{ marginBottom: "1rem" }}>{section.description}</p>
46- <Link to={section.link} className="soft-button">
54+ <h2 style={{ fontSize: "1.25rem", marginBottom: "0.5rem" }}>
55+ {section.title}
56+ </h2>
57+ <p style={{ marginBottom: "0.5rem" }}>{section.description}</p>
58+ <Link
59+ to={section.link}
60+ className="soft-button"
61+ style={{ marginTop: "auto", alignSelf: "flex-start" }}
62+ >
4763 {section.linkText}
4864 </Link>
4965 </div>
5066 );
5167 };
5268
69+interface BenchmarkStatus {
70+ current_dataset: string;
71+ current_algorithm: string;
72+ completed_count: number;
73+ total_count: number;
74+ progress_percentage: number;
75+ elapsed_time: number;
76+ last_update: string;
77+ completed_benchmarks: Array<{
78+ dataset: string;
79+ algorithm: string;
80+ compression_ratio: number;
81+ encode_time: number;
82+ decode_time: number;
83+ cache_status: string;
84+ }>;
85+}
86+
5387 export default function Home() {
88+ const [status, setStatus] = useState<BenchmarkStatus | null>(null);
89+
90+ useEffect(() => {
91+ const fetchStatus = async () => {
92+ try {
93+ const response = await axios.get(
94+ "https://tempory.net/f/memobin/benchmark_status/current.json",
95+ );
96+ setStatus(response.data);
97+ } catch (error) {
98+ console.error("Error fetching benchmark status:", error);
99+ }
100+ };
101+
102+ fetchStatus();
103+ }, []);
104+
54105 return (
55106 <div style={{ maxWidth: "1200px", margin: "0 auto", padding: "2rem" }}>
56107 <h1
@@ -99,8 +150,31 @@ export default function Home() {
99150 style={{ textAlign: "center", color: "#666", fontSize: "0.9rem" }}
100151 >
101152 <p>
102- Last updated: {__BUILD_DATE__}
153+ Last UI update: {__BUILD_DATE__}
103154 <br />
155+ {status && (
156+ <>
157+ <div
158+ style={{
159+ margin: "1rem 0",
160+ padding: "0.5rem",
161+ border: "1px solid #eaeaea",
162+ borderRadius: "4px",
163+ display: "inline-block",
164+ }}
165+ >
166+ Last benchmark run:{" "}
167+ {new Date(status.last_update).toLocaleString()}
168+ <br />
169+ Status:{" "}
170+ {status.progress_percentage === 100
171+ ? "Completed"
172+ : "In Progress"}{" "}
173+ ({status.completed_count}/{status.total_count} benchmarks)
174+ </div>
175+ <br />
176+ </>
177+ )}
104178 Released under{" "}
105179 <a
106180 href="https://github.com/magland/benchcompress/blob/main/LICENSE"
web-ui/src/pages/Submit.tsxadded+14−0View file
@@ -0,0 +1,14 @@
1+import submitContent from "./submit.md?raw";
2+import ReactMarkdown from "react-markdown";
3+import remarkMath from "remark-math";
4+import rehypeKatex from "rehype-katex";
5+
6+export default function Submit() {
7+ return (
8+ <div className="content-container">
9+ <ReactMarkdown remarkPlugins={[remarkMath]} rehypePlugins={[rehypeKatex]}>
10+ {submitContent}
11+ </ReactMarkdown>
12+ </div>
13+ );
14+}
web-ui/src/pages/submit.mdadded+143−0View file
@@ -0,0 +1,143 @@
1+# Contributing to Benchcompress
2+
3+This guide explains how to contribute new algorithms or datasets to Benchcompress.
4+
5+## Overview
6+
7+Benchcompress welcomes contributions of new compression algorithms and scientific datasets. The framework is designed to make it easy to add new components while ensuring consistent benchmarking and evaluation.
8+
9+## Getting Started
10+
11+1. Fork and clone the repository:
12+```bash
13+git clone https://github.com/[your-username]/benchcompress.git
14+cd benchcompress
15+```
16+
17+2. Install dependencies:
18+```bash
19+# Install Python package
20+cd benchcompress
21+pip install -e .
22+
23+# Install pre-commit hooks for code compliance checks
24+pip install pre-commit
25+pre-commit install
26+```
27+
28+## Adding a New Algorithm
29+
30+New algorithms are added in `benchcompress/src/benchcompress/algorithms/`. Each algorithm should:
31+
32+1. Create a new directory with:
33+ - `__init__.py`: Algorithm implementation
34+ - `algorithm-name.md`: Documentation and description
35+
36+2. In `__init__.py`:
37+ - Implement compression/decompression functions
38+ - Define metadata (version, tags, compatibility)
39+ - Follow existing algorithms as examples
40+
41+Example structure:
42+```
43+algorithms/
44+└── my_algorithm/
45+ ├── __init__.py
46+ └── my_algorithm.md
47+```
48+
49+## Adding a New Dataset
50+
51+New datasets are added in `benchcompress/src/benchcompress/datasets/`. Each dataset should:
52+
53+1. Create a new directory with:
54+ - `__init__.py`: Dataset generation/loading code
55+ - `dataset-name.md`: Documentation and description
56+
57+2. In `__init__.py`:
58+ - Implement data generation/loading
59+ - Define metadata (version, tags)
60+ - Follow existing datasets as examples
61+
62+Example structure:
63+```
64+datasets/
65+└── my_dataset/
66+ ├── __init__.py
67+ └── my_dataset.md
68+```
69+
70+## Testing Locally
71+
72+Run benchmarks for your new component:
73+```bash
74+benchcompress run --algorithm my_algorithm --dataset my_dataset
75+```
76+
77+The framework will automatically:
78+- Run the benchmarks
79+- Verify results by decompressing and comparing with original data
80+- Measure compression ratios and throughput
81+
82+## Code Formatting
83+
84+The project uses specific formatters for each language:
85+- Python: black formatter
86+- TypeScript/JavaScript: ESLint + Prettier
87+- C++: clang-format
88+
89+To format your code before committing:
90+```bash
91+# From project root
92+./devel/format_code.sh
93+```
94+
95+This will format all code according to project standards.
96+
97+## Code Compliance
98+
99+Pre-commit hooks will check code compliance when you commit changes. They verify:
100+- Code formatting
101+- Import ordering
102+- Type checking
103+- Other project-specific rules
104+
105+If checks fail, format your code using the format script and try again.
106+
107+## Creating a Pull Request
108+
109+1. Create a new branch:
110+```bash
111+git checkout -b add-my-component
112+```
113+
114+2. Format code and ensure it passes compliance checks:
115+```bash
116+./devel/format_code.sh
117+```
118+
119+3. Commit your changes:
120+```bash
121+git add .
122+git commit -m "Add new algorithm/dataset: [name]"
123+```
124+
125+4. Push to your fork:
126+```bash
127+git push origin add-my-component
128+```
129+
130+5. Open a pull request on GitHub with:
131+ - Clear description of the new component
132+ - Any relevant background or references
133+ - Local benchmark results
134+ - Confirmation that code is formatted and passes checks
135+
136+## Guidelines
137+
138+- Follow existing code structure and patterns
139+- Include thorough documentation
140+- Add appropriate tags for filtering
141+- Test compatibility with existing components
142+- Format code using provided script
143+- Ensure all pre-commit checks pass
web-ui/tsconfig.app.tsbuildinfomodified+1−1View file
@@ -1 +1 @@
1-{"root":["./src/App.tsx","./src/main.tsx","./src/types.ts","./src/vite-env.d.ts","./src/components/BenchmarkTable.tsx","./src/components/ScrollToTop.tsx","./src/components/TagFilter.tsx","./src/components/algorithm/AlgorithmContent.tsx","./src/components/benchmark/charts/BenchmarkCharts.tsx","./src/components/benchmark/export/csvExport.ts","./src/components/benchmark/table/BenchmarkTable.tsx","./src/components/benchmark/table/columns.tsx","./src/components/benchmark/utils/formatters.ts","./src/components/dataset/DatasetContent.tsx","./src/components/dataset/TimeseriesView.tsx","./src/components/dataset/TimeseriesViewWorker.ts","./src/components/dataset/WorkerTypes.ts","./src/components/dataset/timeseriesViewReducer.ts","./src/components/tables/DatasetAlgorithmTables.tsx","./src/hooks/TimeseriesDataClient.ts","./src/hooks/useBenchmarkChartData.ts","./src/hooks/useMarkdownContent.ts","./src/hooks/useMarkdownPosts.ts","./src/hooks/useTagFilter.ts","./src/hooks/useTimeseriesData.ts","./src/hooks/useTimeseriesDataClient.ts","./src/pages/About.tsx","./src/pages/Algorithm.tsx","./src/pages/Dataset.tsx","./src/pages/Home.tsx","./src/pages/Paper.tsx","./src/reducers/tabsReducer.ts"],"version":"5.6.3"}
\ No newline at end of file
1+{"root":["./src/App.tsx","./src/env.d.ts","./src/main.tsx","./src/types.ts","./src/vite-env.d.ts","./src/components/BenchmarkTable.tsx","./src/components/ScrollToTop.tsx","./src/components/TagFilter.tsx","./src/components/algorithm/AlgorithmContent.tsx","./src/components/benchmark/charts/BenchmarkCharts.tsx","./src/components/benchmark/export/csvExport.ts","./src/components/benchmark/table/BenchmarkTable.tsx","./src/components/benchmark/table/columns.tsx","./src/components/benchmark/utils/formatters.ts","./src/components/dataset/DatasetContent.tsx","./src/components/dataset/TimeseriesNavigationBar.tsx","./src/components/dataset/TimeseriesView.tsx","./src/components/dataset/TimeseriesViewWorker.ts","./src/components/dataset/WorkerTypes.ts","./src/components/dataset/timeseriesViewReducer.ts","./src/components/shared/BaseContent.tsx","./src/components/tables/DatasetAlgorithmTables.tsx","./src/hooks/TimeseriesDataClient.ts","./src/hooks/useBenchmarkChartData.ts","./src/hooks/useMarkdownContent.ts","./src/hooks/useMarkdownPosts.ts","./src/hooks/useTagFilter.ts","./src/hooks/useTimeseriesData.ts","./src/hooks/useTimeseriesDataClient.ts","./src/pages/About.tsx","./src/pages/Algorithm.tsx","./src/pages/BenchmarkView.tsx","./src/pages/Dataset.tsx","./src/pages/Home.tsx","./src/pages/Monitor.tsx","./src/pages/Paper.tsx","./src/reducers/tabsReducer.ts","./src/types/home-content.ts"],"version":"5.6.3"}
\ No newline at end of file
moveopenescclose