From 6a626689b25506afb61329e2e15d04d5fea375dd Mon Sep 17 00:00:00 2001 From: Eyal Gruss Date: Thu, 19 Sep 2024 08:16:32 +0300 Subject: [PATCH] revert from transformers.js 3beta to 2 due to crash; add architecture diagram --- LordTubeMaster.svg | 13 +++++++++++++ README.md | 8 ++++++-- index.html | 2 +- script.js | 3 ++- 4 files changed, 22 insertions(+), 4 deletions(-) create mode 100644 LordTubeMaster.svg diff --git a/LordTubeMaster.svg b/LordTubeMaster.svg new file mode 100644 index 0000000..408833a --- /dev/null +++ b/LordTubeMaster.svg @@ -0,0 +1,13 @@ + + + + + + + + <iframe src="https://youtube.com/...">getDisplayMedia({ preferCurrentTab: true })Element Capture (restrictTo)Region Capture (cropTo)MediaStreamTrackProcessorTransformStreamMediaStreamTrackGenerator<canvas><video>WebGLThree.jsSwissGLWebGPUTensorFlow.jsONNX Runtime webTransformers.jsWebAssembly(Wasm)MediaPipeVanillaJSScreenCaptureAPIInsertableStreamsAPI \ No newline at end of file diff --git a/README.md b/README.md index 9043495..1c4cd61 100644 --- a/README.md +++ b/README.md @@ -14,9 +14,13 @@ For fullscreen zoom of output (with right-click) enable: `chrome://flags/#elemen You can browse the effects with `Alt+↑` and `Alt+↓` The code demos usages with Wasm ([MediaPipe](https://ai.google.dev/edge/mediapipe/solutions/guide)), -WebGPU ([Transformers.js](https://huggingface.co/docs/transformers.js/index), [TensorFlow.js](https://www.tensorflow.org/js), [ONNX-Runtime](https://onnxruntime.ai/docs/get-started/with-javascript/web.html)), -WebGL ([SwissGL](https://google.github.io/swissgl/), [Three.js](https://threejs.org/)), and VanillaJS. +WebGPU ([TensorFlow.js](https://www.tensorflow.org/js), [ONNX Runtime Web](https://onnxruntime.ai/docs/get-started/with-javascript/web.html), [Transformers.js](https://huggingface.co/docs/transformers.js/index)), +WebGL ([Three.js](https://threejs.org/), [SwissGL](https://google.github.io/swissgl/)), and VanillaJS.
[Demo video](https://github.com/eyaler/LordTubeMaster/assets/4436747/2352969c-889d-478e-b386-8bdf6452a797) + +
+ +![Architecture](LordTubeMaster.svg) diff --git a/index.html b/index.html index b8b5cab..fe6e8ee 100644 --- a/index.html +++ b/index.html @@ -22,7 +22,7 @@ - +
diff --git a/script.js b/script.js index df983ee..880d4bc 100644 --- a/script.js +++ b/script.js @@ -14,7 +14,8 @@ import { } from 'https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.15/vision_bundle.mjs' const mediapipe_wasm_url = 'https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.15/wasm' -import {AutoModel, AutoProcessor, RawImage} from 'https://cdn.jsdelivr.net/npm/@huggingface/transformers@3.0.0-alpha.15/dist/transformers.min.js' +import {AutoModel, AutoProcessor, RawImage} from 'https://cdn.jsdelivr.net/npm/@xenova/transformers@2.17/dist/transformers.min.js' +// import {AutoModel, AutoProcessor, RawImage} from 'https://cdn.jsdelivr.net/npm/@huggingface/transformers@3.0.0-alpha.15/dist/transformers.min.js' import 'https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@4.21.0/dist/tf.min.js' import 'https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-backend-webgpu@4.21.0/dist/tf-backend-webgpu.min.js'