System Architecture

Offline

System Architecture

Full-stack architecture of the MITCF Web Visualization Platform — frontend, API, service, and research layers.

Frontend Layer

Next.js 14 (App Router)

React framework with TypeScript, Tailwind CSS

react-plotly.js

Scientific charts and interactive visualizations

WebSocket client

Native browser WebSocket for real-time system stats

Lucide React

Icon library

API Layer

FastAPI 0.162

REST API with auto-generated OpenAPI docs at /docs

Pydantic v2

Request/response validation and serialization

WebSocket endpoint /ws

Streams system stats (CPU, RAM) every 2 seconds

StaticFiles /graph

Serves PNG charts from graph/ directory

Service Layer

data_service.py

Reads CSV/JSONL/JSON from project outputs

fuzzy_service.py

Wraps FuzzyDecisionGate for live evaluation

experiment_service.py

Background threading for experiment/training jobs

Research Layer (existing)

mitcf_pipeline/

Complete MITCF research implementation (untouched)

FuzzyDecisionGate

Pure-Python Mamdani inference system

NeuralBinaryClassifier

Custom MLP with manual backprop

MITCFController

Orchestrates 5-condition ablation pipeline

Data Layer

graph/model_results.csv

20-model training results

graph/training_history.csv

Per-epoch training curves

graph/fuzzy_gate/

Fuzzy gate results, distributions, manifests

outputs/*/metrics_by_condition.csv

Experiment condition metrics (3 runs)

Data Flow

Browser
(React)
→
FastAPI
:8000
→
data_service
fuzzy_service
→
CSV/JSON
files
Browser
WebSocket
⇄
/ws endpoint
FastAPI
→
psutil
(CPU/RAM)
→
TopBar
Live Charts

Data Integrity Guarantee

All data displayed in this platform is read directly from the project's CSV, JSONL, and JSON output files. No values are hardcoded, fabricated, or inferred. The web platform adds zero new experiment logic — it is a read-only visualization layer over the existing MITCF research outputs.