From 58bc5b026c36ce3830b9c05d3656162763593cbc Mon Sep 17 00:00:00 2001 From: Eyal Gruss Date: Mon, 23 Sep 2024 18:41:21 +0300 Subject: [PATCH] add known issues to readme; dont capture on focus, but add capture on event change --- README.md | 4 ++++ script.js | 9 +++++---- style.css | 2 +- 3 files changed, 10 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 1c4cd61..21d4209 100644 --- a/README.md +++ b/README.md @@ -17,6 +17,10 @@ The code demos usages with Wasm ([MediaPipe](https://ai.google.dev/edge/mediapip 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. +Known issues: +1. Modnet crashes using Transformers.js v3-alpha on Chromium 129+: https://github.com/xenova/transformers.js/issues/943 (I currently reverted to v2 causing a significant slowdown) +2. Resolution of captured media is doubled for smaller frames: https://github.com/screen-share/element-capture/issues/44 +
[Demo video](https://github.com/eyaler/LordTubeMaster/assets/4436747/2352969c-889d-478e-b386-8bdf6452a797) diff --git a/script.js b/script.js index 880d4bc..2f53269 100644 --- a/script.js +++ b/script.js @@ -14,8 +14,9 @@ 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/@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 {AutoModel, AutoProcessor, RawImage} from 'https://cdn.jsdelivr.net/npm/@xenova/transformers@2.17.2/dist/transformers.min.js' +// import {AutoModel, AutoProcessor, RawImage} from 'https://cdn.jsdelivr.net/npm/@huggingface/transformers@3.0.0-alpha.16/dist/transformers.min.js' +// Note modnet on transformers v3 is 10x faster on chromium 128 but crashed on 129+. See: https://github.com/xenova/transformers.js/issues/943 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' @@ -68,12 +69,12 @@ video_url.addEventListener('change', e => { video_url.addEventListener('focus', e => { skip_changed = false e.currentTarget.select() // Broken in Chrome. See: https://issues.chromium.org/issues/40345011#comment45 - if (e.currentTarget.value) - capture() }) let loop_mode effect.addEventListener('change', e => { + if (e.currentTarget.value) + capture() loop_mode = null if (e.currentTarget.value == 'loop' || e.currentTarget.value == 'random') { loop_mode = e.currentTarget.value diff --git a/style.css b/style.css index 82f0948..6f88945 100644 --- a/style.css +++ b/style.css @@ -17,7 +17,7 @@ footer { } #inputs { - column-gap: 1.5rem; + column-gap: 1rem; display: flex; flex-wrap: wrap; justify-content: space-around;