Skip to content

Thesis Scope & Prototype Baseline

2026-05-06 — Research framework & initial architecture


Thesis title & overview

Vergleich von Web-Frameworks zur Ausführung von ML-Modellen im Browser

The thesis investigates and compares different approaches to running ML models directly in the browser — no server-side inference required. Historically, browser ML meant API calls to backend servers. Frameworks like TensorFlow.js, keras.js, ONNX.js, and MediaPipe now make client-side inference viable.


Comparison criteria

Criterion What we measure
Framework support Which ML frameworks and model formats are supported? (PyTorch, ONNX, TF SavedModel, TFLite)
Functionality GPU acceleration, parallel execution, backend diversity, preprocessing APIs
Performance Inference latency (cold & warm), model load time, memory consumption — across browsers
Community / Reach GitHub stars, npm downloads, maintenance activity, documentation quality
Integration (optional) Ease of use, API design, pipeline abstraction vs low-level tensor ops

Required frameworks

From the thesis specification:

  • TensorFlow.js — Google's production-grade browser ML framework
  • keras.js — Legacy Keras-to-browser bridge (last commit ~2018)
  • ONNX Runtime Web — Microsoft's cross-platform ONNX inference engine
  • MediaPipe — Google's task-optimized vision/audio pipeline library

The thesis also mentions Transformers.js indirectly via HuggingFace as a model source. We include it as a fifth candidate representing the high-level pipeline abstraction approach.


Prototype architecture

The prototype implements a layers architecture as a zero-build, CDN-only SPA:

Layer Color Responsibility
Shell / Router Blue Hash-based SPA routing, role/theme management, mobile nav
Tutorial Engine Green 5-step guided walkthrough for learners
Playground Engine Yellow Free-form block-based pipeline configuration
Block Runtime Purple BlockRegistry, DataFlowGraph, BlockCanvas — compatibility matrix
ML Execution Red AdapterFactory, per-runtime adapters, inference orchestration
Benchmarking Pink MetricsCollector, RunRecorder, DiffComparator

Key code review findings

Severity Issue Status
Medium ONNX model URL was null — adapter always failed. COMPAT matrix still showed ONNX as valid. Fixed — marked all ONNX backends unsupported until model sourcing resolved
Low Misleading tooltip when disabled task selected in playground Fixed
Low Orphaned _refreshBackendCards() dead code Removed
Low Redundant double ternary in TransformersAdapter Simplified
Info performance.memory is Chromium-only — memDelta returns null on Firefox/Safari Known limitation
Info MediaPipe + ONNX require SharedArrayBuffer (COOP/COEP headers) Documented, runtime check pending