implement html output, fix log scaling in charts

Signed-off-by: dalthecow <[email protected]>

Author: DaltheCow

.github/workflows/development.yml

@@ -271,6 +271,11 @@ jobs:
         with:
           fetch-depth: 0
 
+      - name: Set up Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
       - name: Check if UI-related files changed
         id: check-changes
         run: |

.gitignore

@@ -6,6 +6,7 @@ src/guidellm/version.py
 benchmarks.json
 benchmarks.yaml
 benchmarks.csv
+benchmarks.html
 
 # Byte-compiled / optimized / DLL files
 __pycache__/
@@ -227,4 +228,5 @@ src/ui/next-env.d.ts
 !tsconfig.*.json
 !src/ui/lib
 !src/ui/public/manifest.json
+!src/ui/serve.json
 .eslintcache

DEVELOPING.md

@@ -267,6 +267,16 @@ Reference [https://www.npmjs.com/package/jest-runner-groups](jest-runner-groups)
  */
 ```
 
+### 🧪 UI Development Notes
+
+During development, it can be helpful to view sample data. We include a sample benchmark run wired into the Redux store under:
+
+```
+src/ui/lib/store/[runInfo/workloadDetails/benchmarks]WindowData.ts
+```
+
+In the future this will be replaced by a configurable untracked file for dev use.
+
 ### Logging
 
 Logging is useful for learning how GuideLLM works and finding problems.

README.md

@@ -157,9 +157,41 @@ The `guidellm benchmark` command is used to run benchmarks against a generative
 
 GuideLLM UI is a companion frontend for visualizing the results of a GuideLLM benchmark run.
 
-### 🛠 Running the UI
+### 🛠 Generating an HTML report with a benchmark run
 
-The UI is a WIP, check more recent PRs for the latest updates
+Set the output to benchmarks.html for your run:
+
+```base
+--output-path=benchmarks.html
+```
+
+1. Use the Hosted Build (Recommended for Most Users)
+
+This is preconfigured. The latest stable version of the hosted UI (https://neuralmagic.github.io/guidellm/ui/latest) will be used to build the local html file.
+
+Open benchmarks.html in your browser and you're done—no setup required.
+
+2. Build and Serve the UI Locally (For Development) This option is useful if:
+
+- You are actively developing the UI
+
+- You want to test changes to the UI before publishing
+
+- You want full control over how the report is displayed
+
+```bash
+npm install
+npm run build
+npm run serve
+```
+
+This will start a local server (e.g., at http://localhost:3000). Then set the Environment to LOCAL before running your benchmarks.
+
+```bash
+export GUIDELLM__ENV=local
+
+Alternatively, in config.py update the ENV_REPORT_MAPPING used as the asset base for report generation to the LOCAL option.
+```
 
 ## Resources
 

package-lock.json

@@ -5,6 +5,7 @@
   "scripts": {
     "dev": "next dev src/ui",
     "build": "next build src/ui",
+    "serve": "serve src/ui/out -c ../serve.json --cors",
     "lint": "next lint --fix src/ui",
     "type-check": "tsc -p src/ui/tsconfig.json --noEmit && tsc -p tsconfig.test.json --noEmit && tsc -p tsconfig.cypress.json --noEmit",
     "format": "prettier --write .",
@@ -71,6 +72,7 @@
     "jest-runner-groups": "^2.2.0",
     "jest-transform-stub": "^2.0.0",
     "prettier": "^3.5.3",
+    "serve": "^14.2.4",
     "sharp": "^0.32.0",
     "typescript": "^5",
     "typescript-eslint": "^8.34.0"

package.json

@@ -53,6 +53,7 @@ dependencies = [
     "protobuf",
     "pydantic>=2.11.7",
     "pydantic-settings>=2.0.0",
+    "pyhumps>=3.8.0",
     "pyyaml>=6.0.0",
     "rich",
     "transformers",

pyproject.toml

@@ -220,7 +220,7 @@ def benchmark():
     help=(
         "The path to save the output to. If it is a directory, "
         "it will save benchmarks.json under it. "
-        "Otherwise, json, yaml, or csv files are supported for output types "
+        "Otherwise, json, yaml, csv, or html files are supported for output types "
         "which will be read from the extension for the file path."
     ),
 )

src/guidellm/__main__.py

@@ -6,6 +6,7 @@
 from pathlib import Path
 from typing import Any, Literal, Optional, Union
 
+import humps  # type: ignore[import-not-found]
 import yaml
 from pydantic import Field
 from rich.console import Console
@@ -25,6 +26,8 @@
     StandardBaseModel,
     StatusDistributionSummary,
 )
+from guidellm.presentation import UIDataBuilder
+from guidellm.presentation.injector import create_report
 from guidellm.scheduler import strategy_display_str
 from guidellm.utils import Colors, split_text_list_by_length
 
@@ -68,6 +71,9 @@ def load_file(path: Union[str, Path]) -> "GenerativeBenchmarksReport":
         if type_ == "csv":
             raise ValueError(f"CSV file type is not supported for loading: {path}.")
 
+        if type_ == "html":
+            raise ValueError(f"HTML file type is not supported for loading: {path}.")
+
         raise ValueError(f"Unsupported file type: {type_} for {path}.")
 
     benchmarks: list[GenerativeBenchmark] = Field(
@@ -114,6 +120,9 @@ def save_file(self, path: Union[str, Path]) -> Path:
         if type_ == "csv":
             return self.save_csv(path)
 
+        if type_ == "html":
+            return self.save_html(path)
+
         raise ValueError(f"Unsupported file type: {type_} for {path}.")
 
     def save_json(self, path: Union[str, Path]) -> Path:
@@ -220,11 +229,29 @@ def save_csv(self, path: Union[str, Path]) -> Path:
 
         return path
 
+    def save_html(self, path: Union[str, Path]) -> Path:
+        """
+        Download html, inject report data and save to a file.
+
+        :param path: The path to create the report at.
+        :return: The path to the report.
+        """
+
+        data_builder = UIDataBuilder(self.benchmarks)
+        data = data_builder.to_dict()
+        camel_data = humps.camelize(data)
+        ui_api_data = {}
+        for k, v in camel_data.items():
+            key = f"window.{humps.decamelize(k)} = {{}};"
+            value = f"window.{humps.decamelize(k)} = {json.dumps(v, indent=2)};\n"
+            ui_api_data[key] = value
+        return create_report(ui_api_data, path)
+
     @staticmethod
     def _file_setup(
         path: Union[str, Path],
-        default_file_type: Literal["json", "yaml", "csv"] = "json",
-    ) -> tuple[Path, Literal["json", "yaml", "csv"]]:
+        default_file_type: Literal["json", "yaml", "csv", "html"] = "json",
+    ) -> tuple[Path, Literal["json", "yaml", "csv", "html"]]:
         path = Path(path) if not isinstance(path, Path) else path
 
         if path.is_dir():
@@ -242,9 +269,12 @@ def _file_setup(
         if path_suffix in [".csv"]:
             return path, "csv"
 
+        if path_suffix in [".html"]:
+            return path, "html"
+
         raise ValueError(
             f"Unsupported file extension: {path_suffix} for {path}; "
-            "expected json, yaml, or csv."
+            "expected json, yaml, csv, or html."
         )
 
     @staticmethod

src/guidellm/benchmark/output.py

@@ -30,10 +30,10 @@ class Environment(str, Enum):
 
 
 ENV_REPORT_MAPPING = {
-    Environment.PROD: "https://guidellm.neuralmagic.com/local-report/index.html",
-    Environment.STAGING: "https://staging.guidellm.neuralmagic.com/local-report/index.html",
-    Environment.DEV: "https://dev.guidellm.neuralmagic.com/local-report/index.html",
-    Environment.LOCAL: "tests/dummy/report.html",
+    Environment.PROD: "https://neuralmagic.github.io/guidellm/ui/latest/index.html",
+    Environment.STAGING: "https://neuralmagic.github.io/guidellm/ui/release/latest/index.html",
+    Environment.DEV: "https://neuralmagic.github.io/guidellm/ui/dev/index.html",
+    Environment.LOCAL: "http://localhost:3000/index.html",
 }
 
 
@@ -87,6 +87,14 @@ class OpenAISettings(BaseModel):
     max_output_tokens: int = 16384
 
 
+class ReportGenerationSettings(BaseModel):
+    """
+    Report generation settings for the application
+    """
+
+    source: str = ""
+
+
 class Settings(BaseSettings):
     """
     All the settings are powered by pydantic_settings and could be
@@ -140,6 +148,9 @@ class Settings(BaseSettings):
     )
     openai: OpenAISettings = OpenAISettings()
 
+    # Report settings
+    report_generation: ReportGenerationSettings = ReportGenerationSettings()
+
     # Output settings
     table_border_char: str = "="
     table_headers_border_char: str = "-"
@@ -148,6 +159,8 @@ class Settings(BaseSettings):
     @model_validator(mode="after")
     @classmethod
     def set_default_source(cls, values):
+        if not values.report_generation.source:
+            values.report_generation.source = ENV_REPORT_MAPPING.get(values.env)
         return values
 
     def generate_env_file(self) -> str: