스크립트
00:00:00Google hat gerade eine neue Laufzeitbibliothek veröffentlicht, mit der Sie Machine-Learning- und KI-Modelle
00:00:05nahezu in nativer Geschwindigkeit direkt im Browser ausführen können. Sie heißt LiteRT.js und ist wirklich beeindruckend. Also,
00:00:12in diesem Video schauen wir uns LiteRT.js genauer an, wie es funktioniert, und wir testen es,
00:00:18indem wir eine 3D-Bewegungserfassungsanwendung in Echtzeit bauen, die vollständig im Browser läuft. Das wird
00:00:24viel Spaß machen, also legen wir los. Was genau ist LiteRT.js? Nun, es ist eine JavaScript-Anbindung für
00:00:36LiteRT, ihre On-Device-Inferenz-Laufzeitumgebung, die bereits seit Jahren Modelle auf Android, iOS und eingebetteter
00:00:42Hardware ausführt. Aber LiteRT.js bringt dieselbe Laufzeitumgebung via WebAssembly mithilfe des
00:00:50LiteRT.js-Core-npm-Pakets in den Browser. Und das macht den Unterschied von LiteRT.js aus. Google hat bereits eine
00:00:58Machine-Learning-Bibliothek für den Browser namens TensorFlow.js, die es schon seit Jahren gibt. Aber
00:01:04TensorFlow.js läuft auf JavaScript-basierten Kernels, was ein großer Flaschenhals ist. Sehen Sie, JavaScript-Kernels
00:01:11können CPU oder GPU nicht so effizient nutzen wie eine native Laufzeitumgebung. Daher blieb TensorFlow.js immer hinter der
00:01:19Leistung nativer Apps zurück. Aber LiteRT.js verwendet WebAssembly und bringt einen eigenen optimierten Kernel mit.
00:01:27Die gleiche native Laufzeitumgebung, die Android- und iOS-Inferenz antreibt, wird in WASM kompiliert und dann für
00:01:34LiteRT.js zugänglich gemacht. Man erhält also keine Web-Abstraktionsschicht mehr, sondern bekommt tatsächlich
00:01:40eine wirklich optimierte Laufzeit-Engine. Das zeigt sich auch in der Backend-Architektur. LiteRT.js verfügt über
00:01:47drei verschiedene Ebenen, die eine gute Leistung auf CPUs, GPUs und sogar NPUs ermöglichen. Auf der CPU-Seite
00:01:55verwendet es XNNPack, Googles optimierte CPU-Kernel-Bibliothek, die Multi-Threading mit Relaxed-SIMD-Unterstützung bietet.
00:02:04Das ist der universelle Fallback, der überall läuft, ganz ohne GPU. Aber für GPUs
00:02:11nutzt es ML-Drift über WebGPU, und hier liegt die wahre Leistung. Es verwendet native GPU-Kernel,
00:02:18sodass Dinge wie Shader nicht mehr über eine JavaScript-Orchestrierung gerendert werden. Und für
00:02:24NPUs gibt es WebNN, das in Chrome und Edge noch experimentell ist und auf dedizierte
00:02:31Hardware für energieeffiziente Inferenz abzielt. Laut Googles eigenen Benchmarks,
00:02:37die sie auf einem 2024 MacBook Pro mit M4-Chip durchgeführt haben, scheint die Inferenz dreimal schneller zu sein als
00:02:45andere Web-Laufzeitumgebungen auf CPU und GPU bei Vision- und Audiomodellen. Wenn man Arbeitslasten wie
00:02:53Objektverfolgung, Audiotranskription oder Bildbearbeitung auf der GPU oder NPU statt auf der CPU ausführt,
00:03:00erhalten wir Leistungssprünge, die je nach Aufgabe fünf bis 60 Mal schneller sind,
00:03:07erwähnenswert ist, dass dies der Best-Case ist. Google erkennt dies ebenfalls an.
00:03:13Die Ergebnisse können also variieren, je nach spezifischer GPU,
00:03:18thermischer Drosselung und Treiberqualität. Es gibt noch etwas, das für diese Laufzeit wichtig ist.
00:03:24Wenn Sie bereits Modelle verwenden, die auf PyTorch oder TensorFlow laufen, oder eine vorhandene
00:03:30TF-Lite-Datei haben, kann LiteRT.js diese direkt ausführen. Und wenn Sie auf PyTorch sind, gibt es auch LiteRT
00:03:38Torch, einen Konvertierungspfad, der Ihr Modell direkt in .TF-Lite umwandelt. Zudem gibt es einen AI-Edge-
00:03:44Quantisierer zur Verkleinerung von Modellgrößen ohne komplettes Neuschreiben. Legacy-Workflows, die Sie für
00:03:50TensorFlow.js genutzt haben, können leicht auf das neue LiteRT.js portiert werden, was super cool ist. Aber was kann man
00:03:58tatsächlich damit tun? Google hat einige tolle Demos, die einen Eindruck von der
00:04:03Bandbreite vermitteln. Sie können Echtzeit-YOLO-Objekterkennung machen, monokulare Tiefenschätzung mit der
00:04:09Depth-Anything-Bibliothek, die Ihren Webcam-Feed in eine Live-3D-Punktwolke verwandelt. Außerdem kann sie Bild-
00:04:16hochskalierung mit der Real-ESRGAN-Bibliothek durchführen. Alle diese Demos laufen komplett clientseitig,
00:04:23ohne Backends, ohne APIs, direkt in Ihrem Browser. Und sie haben bereits angekündigt, was als Nächstes kommt:
00:04:29LiteRT.LM.js. Damit können vollständige Sprachmodelle lokal im Browser ausgeführt werden.
00:04:36Das ist also nicht nur für Computer Vision. Bald wird es auch lokale LLM-Inferenz bieten.
00:04:42Das klingt alles großartig, aber ich wollte es selbst testen, um zu sehen, wie leistungsfähig es wirklich
00:04:48ist. Für diese Demo habe ich beschlossen, eine echte Motion-Capture-Anwendung zu erstellen, die Ihre Webcam für
00:04:55Echtzeit-Pose-Schätzung nutzt. Sie läuft ebenfalls vollständig in Ihrem Browser, clientseitig und offline, ohne
00:05:03Haken. Ich habe diese App mit Cloud-Code und dem neuen Fable-5-Modell programmiert. Hier ist das Ergebnis.
00:05:10Falls Sie das Repo herunterladen und selbst damit herumspielen möchten, habe ich einen Link zum
00:05:15Projekt in der Beschreibung unten hinzugefügt. Hier läuft LiteRT.js im Browser mit einem Blaze-Pose-Modell
00:05:23mit 33 Körpermarkierungen, das einen 3D-Charakter in Echtzeit mit 3.js steuert. Es gibt keinen Backend-Server und
00:05:31alles, was Sie sehen, passiert gerade auf dieser Maschine komplett offline. Wir sehen hier, dass wir auf der
00:05:38CPU durchschnittlich etwa 38 FPS mit einer Inferenzzeit von 23,3 Millisekunden erreichen. Wir sehen auch, dass die Posen-
00:05:47schätzung ein wenig hinterherhinkt. Aber wenn wir zur WebGPU-Version wechseln, sehen wir, dass wir jetzt
00:05:54konstante 120 Bilder pro Sekunde bei einer Inferenzzeit von 8,4 Millisekunden erhalten. Und die Posen-Schätzung ist auch etwas
00:06:02schneller. Das ist ein etwa dreifacher Anstieg der Framerate und eine 2,8-fache Verringerung der Inferenzzeit,
00:06:10was mit Googles eigenen Zahlen übereinstimmt, auch wenn es am unteren Ende ihrer veröffentlichten Werte liegt. Aber wir müssen
00:06:16berücksichtigen, dass Blaze-Pose ein wirklich kleines Modell ist. Es gibt also weniger Rechenaufwand für die GPU,
00:06:23den sie bewältigen muss. Doch selbst damit reduziert die Verlagerung der Tensor-Berechnungen von der CPU auf die WebGPU die Latenz
00:06:30so weit, dass die Verzögerung deutlich geringer ist. Ich habe auch eine Funktion hinzugefügt, mit der Sie Ihre
00:06:36Pose-Capture-Animation aufnehmen und als JSON oder Bio-Vision-Motion-Capture-Datei exportieren können, um sie dann in
00:06:44Programmen wie Blender zu öffnen und die Animation auf Ihren eigenen Charakter neu zu retargeten. Wie Sie hier sehen,
00:06:49ist es noch nicht perfekt. Die Bewegungen sind nicht sehr detailliert oder verfeinert. Das Ganze ist also
00:06:56noch in Arbeit. Aber es ist super cool, dass ich diese erste Version in nur 10 Minuten
00:07:01mit dem neuen LiteRT.js zum Laufen gebracht habe. Da haben Sie es also. Das ist LiteRT.js in aller Kürze. Es ist
00:07:08ehrlich erstaunlich zu sehen, wie weit WebAssembly die Möglichkeiten zur Ausführung komplexer
00:07:14Anwendungen im Browser vorangetrieben hat. Diese neue LiteRT.js-Bibliothek beweist, dass JavaScript manchmal
00:07:21ein echter Flaschenhals für die Erreichung nahezu nativer Geschwindigkeiten sein kann. Ich bin also sehr beeindruckt von dieser
00:07:27Bibliothek und kann es kaum erwarten, LiteRT.js auszuprobieren, wenn es später in diesem Jahr veröffentlicht wird. Was denken Sie
00:07:35über LiteRT.js? Haben Sie es ausprobiert? Werden Sie es verwenden? Lassen Sie es uns in den Kommentaren unten wissen. Und Leute,
00:07:40wenn Ihnen diese Art von technischen Aufschlüsselungen gefällt, lassen Sie es mich wissen, indem Sie den Like-Button
00:07:45unter dem Video drücken. Und vergessen Sie nicht, unseren Kanal zu abonnieren. Hier war Andres von
00:07:50BetterStack und ich sehe Sie in den nächsten Videos.