TypeScript Types & Interfaces
Relevant source files
The following files were used as context for generating this wiki page:
The TypeScript type system in ONNX-Station serves as the backbone for the application's state management, model export configurations, and benchmarking metrics. It ensures type safety across the React context and individual components, specifically governing how Hugging Face Optimum CLI parameters are mapped and validated within the browser-based workbench.
The architecture relies on centralized type definitions in src/types.ts, which are utilized by the WorkbenchProvider to facilitate data flow between the configuration sidebar, the visualization canvas, and the ONNX Runtime (ORT) benchmarking engine.
Core Configuration & Modalities
The system categorizes model operations into three primary modalities: audio, text, and vision. Each modality dictates a specific set of valid tasks and structural dimension overrides.
Modality and Task Definitions
The project uses a record to map these modalities to specific machine learning tasks supported by the Optimum export pipeline.
The diagram shows the relationship between core modalities and their associated tasks as defined in the static task map.
Sources: src/types.ts:1-25, src/components/Sidebar.tsx:180-213
Export Configuration Schema
The ExportConfig interface defines the comprehensive state for an ONNX export request. It includes hardware targets, optimization levels, and framework-specific flags.
| Field | Type | Description |
|---|---|---|
modelSourceType | 'hub' | 'local' | Whether the model is from Hugging Face Hub or a local path. |
modality | Modality | Input type: audio, text, or vision. |
opset | number | The ONNX operator version (e.g., 14, 15, 17). |
device | 'cpu' | 'cuda' | The target execution provider. |
dtype | 'fp32' | 'fp16' | 'bf16' | Tensor data type precision. |
optimize | 'none' | 'O1' | 'O2' | 'O3' | 'O4' | Graph optimization levels for the compiler. |
monolith | boolean | If true, prevents splitting weights into shards. |
Sources: src/types.ts:27-62, src/WorkbenchContext.tsx:75-104
Analysis & Benchmarking Interfaces
Data structures in the project handle both real-time performance metrics and simulated graph analysis.
Benchmark Results
The BenchmarkResult interface captures the output of the ONNX Runtime execution within the browser. This includes latency percentiles and throughput calculations.
This class diagram illustrates the data structure returned by the benchmarking utility after processing execution parameters.
Sources: src/lib/benchmark.ts:21-32, src/types.ts:79-90
Compiled Model Information
The CompiledModelInfo and CompiledModelOperator interfaces are used to represent the topology of the exported ONNX graph. This includes counts of specific operator types (e.g., MatMul, Conv) and their estimated memory footprint.
- Operator Categories: Operators are classified into
compute,memory,activation,normalization, orshape. - VRAM Mapping: The system calculates
memoryMbandpercentageof total operations for visualization in D3-based charts.
Sources: src/types.ts:66-90, src/utils/modelInfo.ts:13-68
Logging and UI State
To track the orchestration of the export and benchmarking processes, the system utilizes a structured logging type and application status indicators.
Log Schema
Every message in the terminal console is represented by a LogEntry.
export interface LogEntry {
id: string;
timestamp: string;
level: LogLevel; // 'info' | 'warn' | 'error' | 'success'
message: string;
}
Sources: src/types.ts:64, 92-97, src/WorkbenchContext.tsx:126-136
Application State Flow
The WorkbenchContextType defines the methods and properties available to components, including state flags like isExporting and isCompiled.
The flow shows how the TypeScript interfaces facilitate communication between the central context and the UI components.
Sources: src/WorkbenchContext.tsx:47-73, src/components/CenterCanvas.tsx:11-40
Summary
The TypeScript types and interfaces in ONNX-Station provide a strict contract between the user interface and the underlying AI optimization tools. By centralizing modality-specific shapes and model metadata through interfaces like ExportConfig and CompiledModelInfo, the project ensures that both simulated analysis and live browser benchmarks remain consistent with the Hugging Face Optimum CLI specifications.