Wetron
Wetron

Introduction

Loaded model graph with the property panel showing a weight tensor as a heatmap Loaded model graph with the property panel showing a weight tensor as a heatmap

What it does

Wetron reads neural network model files and produces a structured graph of operators, inputs, and outputs. That graph can then be rendered as an interactive diagram using the React or Svelte renderer packages.

ONNX, TFLite, and GGUF expose initializer bytes through ModelGraph.weights, so the property panel can decode supported tensor types and open them in a weight inspector - heatmap, distribution, per-axis profile, sparsity, kernel gallery, quantization, or diagnostics. TF2 SavedModel models load weights from the external checkpoint pair via loadSavedModelWeights.

All parsing runs in the browser via native Web APIs - ArrayBuffer, DataView, TextDecoder, DecompressionStream. No model data leaves the device.

Packages

PackagePurpose
@wetron/coreIR types, format detection, layout transform, unified entry point
@wetron/onnxONNX parser (protobufjs)
@wetron/tfliteTFLite FlatBuffers parser, synchronous
@wetron/kerasKeras 3 .keras archive parser
@wetron/ggufGGUF metadata, quantized tensor, and weight parser
@wetron/torchscriptTorchScript Mobile and ZIP-based .pt parser
@wetron/executorchExecuTorch .pte FlatBuffers parser
@wetron/savedmodelTF SavedModel .pb and Keras metadata .pb parser
@wetron/reactReactFlow-based graph view and property panel
@wetron/svelteSvelteFlow-based graph view and property panel
@wetron/tokensDesign tokens (category colours, CSS custom properties)

Architecture

Parsers are independent packages - you only bundle what you use. They all emit the same ModelGraph IR from @wetron/core. The renderer packages consume that IR via a shared layout transform (dagre).

model file
   ↓
@wetron/<format>  ->  ModelGraph (IR)
                          ↓
                  @wetron/core/transform  ->  FlowNode[] + FlowEdge[]
                                                     ↓
                                          @wetron/react or @wetron/svelte

Format detection

parseModel and detectFormat identify formats from magic bytes, with filename extension as a tiebreaker. detectFormat always returns a format string - never throws.

FormatDetection
SavedModel.pb filename extension (checked before ONNX)
ONNXprotobuf field 1 varint tag 0x08
TFLiteTFL3 or ODLF at offset 4
KerasZIP magic + .keras extension (default for ZIP)
TorchScript ZIPZIP magic + .pt/.ptl extension
TorchScript MobilePTMF at offset 4
ExecuTorchET12 at offset 4
GGUFGGUF at offset 0

Demo app

The repo ships a small demo app under apps/demo (React) and apps/demo-svelte (Svelte) that wire parseModel up to the renderer packages and let you drop any supported file in the browser. Wetron demo app - empty state with drop zone Wetron demo app - empty state with drop zone

Prev
Adding a Parser
Next
ONNX