admin-mrrm/mrrmlabapp

Fork 0

feat(mobile): TrOCR-Tokenizer in JavaScript implementieren #80

New issue

Closed

opened 2026-04-26 09:11:18 +02:00 by admin-mrrm · 1 comment

admin-mrrm commented

2026-04-26 09:11:18 +02:00

Owner

Ziel

Den TrOCR-Decoder-Tokenizer (RoBERTa BPE) in JavaScript implementieren, sodass On-Device-Inferenz ohne Server-Roundtrip möglich ist.

Hintergrund

TrOCR nutzt RoBERTa als Tokenizer (Byte-Pair Encoding). Der Decoder generiert Token-IDs, die in Text umgewandelt werden müssen. Dafür wird benötigt:

vocab.json – Mapping Token → ID
merges.txt – BPE-Merge-Regeln
Decode-Logik: IDs → Subword-Tokens → Unicode-Zeichen

Optionen (absteigend nach Aufwand)

Option A: `@xenova/transformers` (empfohlen)

Hugging Face Transformers.js läuft in React Native via JSI und enthält bereits einen fertigen Tokenizer:

import { AutoTokenizer } from "@xenova/transformers";
const tokenizer = await AutoTokenizer.from_pretrained("microsoft/trocr-small-handwritten");
const text = tokenizer.decode(generatedIds);

Vorteil: Kein eigener Code, gut getestet
Nachteil: Paketgröße (~2 MB JS), React Native Kompatibilität prüfen

Option B: Minimale BPE-Implementierung in TypeScript

Nur die Decode-Richtung implementieren (IDs → Text), kein Encode nötig:

vocab.json laden
Token-IDs → Tokens → Byte-Array → UTF-8 dekodieren
Vorteil: Keine externe Abhängigkeit, klein
Nachteil: ~100–150 Zeilen Code, edge cases

Option C: WASM-Bundle

Python-Tokenizer via Pyodide oder ähnliches – zu schwer für Mobile.

Empfehlung

Option A zuerst versuchen; bei Kompatibilitätsproblemen auf Option B zurückfallen.

Aufgaben

@xenova/transformers in React Native testen (JSI-Kompatibilität)
Falls A nicht funktioniert: eigenen BPE-Decoder implementieren und unit-testen
Tokenizer-Output mit Python-Referenz vergleichen (gleiche IDs → gleicher Text?)

Akzeptanzkriterien

decode([1, 234, 567, 2]) liefert identisches Ergebnis wie Python tokenizer.decode()
Unit-Tests für mindestens 5 typische Einkaufslisten-Wörter

## Ziel Den TrOCR-Decoder-Tokenizer (RoBERTa BPE) in JavaScript implementieren, sodass On-Device-Inferenz ohne Server-Roundtrip möglich ist. ## Hintergrund TrOCR nutzt RoBERTa als Tokenizer (Byte-Pair Encoding). Der Decoder generiert Token-IDs, die in Text umgewandelt werden müssen. Dafür wird benötigt: - `vocab.json` – Mapping Token → ID - `merges.txt` – BPE-Merge-Regeln - Decode-Logik: IDs → Subword-Tokens → Unicode-Zeichen ## Optionen (absteigend nach Aufwand) ### Option A: `@xenova/transformers` (empfohlen) Hugging Face Transformers.js läuft in React Native via JSI und enthält bereits einen fertigen Tokenizer: ```ts import { AutoTokenizer } from "@xenova/transformers"; const tokenizer = await AutoTokenizer.from_pretrained("microsoft/trocr-small-handwritten"); const text = tokenizer.decode(generatedIds); ``` **Vorteil**: Kein eigener Code, gut getestet **Nachteil**: Paketgröße (~2 MB JS), React Native Kompatibilität prüfen ### Option B: Minimale BPE-Implementierung in TypeScript Nur die Decode-Richtung implementieren (IDs → Text), kein Encode nötig: - `vocab.json` laden - Token-IDs → Tokens → Byte-Array → UTF-8 dekodieren **Vorteil**: Keine externe Abhängigkeit, klein **Nachteil**: ~100–150 Zeilen Code, edge cases ### Option C: WASM-Bundle Python-Tokenizer via Pyodide oder ähnliches – zu schwer für Mobile. ## Empfehlung Option A zuerst versuchen; bei Kompatibilitätsproblemen auf Option B zurückfallen. ## Aufgaben - [ ] `@xenova/transformers` in React Native testen (JSI-Kompatibilität) - [ ] Falls A nicht funktioniert: eigenen BPE-Decoder implementieren und unit-testen - [ ] Tokenizer-Output mit Python-Referenz vergleichen (gleiche IDs → gleicher Text?) ## Akzeptanzkriterien - [ ] `decode([1, 234, 567, 2])` liefert identisches Ergebnis wie Python `tokenizer.decode()` - [ ] Unit-Tests für mindestens 5 typische Einkaufslisten-Wörter

admin-mrrm added this to the v0.5 — On-Device OCR + Infra milestone

2026-04-26 09:11:18 +02:00

admin-mrrm referenced this issue

2026-04-26 09:11:54 +02:00

feat(mobile): On-Device OCR-Pipeline zusammenführen + Server-Fallback #82

admin-mrrm added the

app/einkaufslisten

area/mobile

type/feature

labels

2026-04-26 22:59:18 +02:00

pm-bot referenced this issue

2026-05-25 22:30:22 +02:00

chore(mobile): On-Device OCR Benchmarking & Qualitätsmessung #83

pm-bot referenced this issue

2026-05-27 22:48:21 +02:00

spike(ocr): TrOCR → ONNX Export & Machbarkeitsnachweis auf Android #77

pm-bot referenced this issue

2026-05-28 06:21:56 +02:00

arch-q: OCR-Integration v0.5 — Bundling, Sync-Modell, Modellwahl, Server-Fallback #413

arch-bot referenced this issue

2026-05-28 06:30:16 +02:00

arch-q: OCR-Integration v0.5 — Bundling, Sync-Modell, Modellwahl, Server-Fallback #413

pm-bot commented

2026-05-28 06:36:19 +02:00

Collaborator

Done-by-spike #77: Tokenizer via @huggingface/transformers (Xenova/trocr-small-printed/tokenizer.json) statt eigener BartTokenizer-JS-Port. Hardcoded decoder_start_token_id=2/eos_token_id=2 da Xenova bos_token_id=null setzt.

Done-by-spike #77: Tokenizer via `@huggingface/transformers` (`Xenova/trocr-small-printed/tokenizer.json`) statt eigener BartTokenizer-JS-Port. Hardcoded `decoder_start_token_id=2`/`eos_token_id=2` da Xenova `bos_token_id=null` setzt.

pm-bot closed this issue

2026-05-28 06:36:19 +02:00

~~pm-bot referenced this issue 2026-05-28 06:48:27 +02:00~~

Portfolio-Status KW 2026-W22 #412

No milestone

No project

No assignees

2 participants

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

admin-mrrm/mrrmlabapp#80

No description provided.

Rows
Columns

feat(mobile): TrOCR-Tokenizer in JavaScript implementieren #80

Ziel

Hintergrund

Optionen (absteigend nach Aufwand)

Option A: @xenova/transformers (empfohlen)

Option B: Minimale BPE-Implementierung in TypeScript

Option C: WASM-Bundle

Empfehlung

Aufgaben

Akzeptanzkriterien

Option A: `@xenova/transformers` (empfohlen)