vladmandic / human

Human: AI-powered 3D Face Detection & Rotation Tracking, Face Description & Recognition, Body Pose Tracking, 3D Hand & Finger Tracking, Iris Analysis, Age & Gender & Emotion Prediction, Gaze Tracking, Gesture Recognition
https://vladmandic.github.io/human/demo/index.html
MIT License
2.16k stars 309 forks source link

nobundle version not working with webpack (when bundles version is working) #64

Closed HemantKumar01 closed 3 years ago

HemantKumar01 commented 3 years ago

i have imported the nobundle esm version like this-

import Human from "path/human.esm-nobundle.js"

and used it like you have told in usage. As i have been using bodypix and already set wasm backend so i have used no bundle vesion to suppport wasm multithreading using a single program(for speed).

i am using webpack

however when i am trying-

var data=human.image(video, config) //or human.detect

it is resulting in webpack warning 5 times-

WARNING in ./dist/face-detection/human.esm-nobundle.js 8:1751-1753
Should not import the named export 'version' (imported as 'C0') from default-exporting module (only default export is available soon)

when i am running the program it is giving error

Uncaught (in promise) TypeError: Cannot read property 'fx' of undefined
    at Oj (main.js:2)
    at Object.image (main.js:2)
    at main.js:2
    at Yj (main.js:2)

i have tries using image data instead of video, but no luck

vladmandic commented 3 years ago

warning Should not import the named export 'version' (imported as 'C0') from default-exporting module (only default export is available soon) likely comes from:

src/tfjs/tf-browser.ts:

import { version as versionBundle } from '@tensorflow/tfjs/package.json';

and is a false warning posted by webpack - webpack is saying that module should not import specific variable when tfjs has default export, but only point of importing the variable is so user has direct access to tfjs version information from within Human library.

btw, webpack changed behavior several times regarding this warning in the last few months - which version of webpack are you using?

anyhow, i've just done some chances that should help with the false warning (version 0.20.3), but since i'm not using webpack, i cannot be sure if it helps or not.

but the other error is a real one: Uncaught (in promise) TypeError: Cannot read property 'fx' of undefined:

fx is an instance of GLImageFilter used to process input image and it's parent is instance of Human itself - which means entire Human object was not created properly. but since the code is minified, I cannot pin down why is it happening.

can you try posting your code and longer backtrace with the error? that would help me narrow down code path.

also, you can try disabling input image processing before calling human.detect():

config.filter.enabled = false
HemantKumar01 commented 3 years ago

Thanks, here is the complete code https://gist.github.com/HemantKumar01/07fea310b6b8a988261c5955250ce8c7 Sorry if it's messy.

I am using it in a general way with a canvas, so no need to point differently to specific code and the error I have posted before is the complete error

Here is the config I am using

var configForHuman = {
    backend: 'wasm',
    wasmPath: '../node_modules/@tensorflow/tfjs-backend-wasm/dist/',
    gesture: {
        enabled: false
    },
    face: {
        mesh: {
            enabled: false
        },
        iris: {
            enabled: false
        },
        age: {
            enabled: false
        },
        gender: {
            enabled: false
        },
        emotion: {
            enabled: false
        },
        embedding: {
            enabled: true
        }
    },
    body: {
        enabled: false
    },
    hand: {
        enabled: false
    }
};

Everything is working fine with bundled esm version but with about a 100 warnings that some kernel is already specified. The warning maybe because setting tfjs and wasm again in bundled version. However its working(bundled version).

vladmandic commented 3 years ago

regarding warnings when using bundled version, it's simply because tfjs is getting loaded multiple times (bundled version within human and the explicit import from your code) and each time it tries to register kernel and gives up since kernel with that name is already registered. its annoying, but non-critical.

you could remove explicit import of tfjs and just say const tf = human.tf, so version that's bundled within human can be used globally for body-pix as well and avoid extra import. and avoid setting backend to wasm outside of human as it's already set.

and regarding fx error when using non-bundled version, did you try adding filter: { enabled: false } to your configForHuman?

btw, what is the purpose of human here? if its just for face detection, why is embedding calculation enabled? i don't see it used anywhere. and for face detection, just using detector is quite imprecise as it's used as hint more than an exact bounding box - enabling mesh actually stabilizes detected face (it's not used just to calculate mesh points).

HemantKumar01 commented 3 years ago

Thanks for the suggestion on bundled version and bodypix. However I have not tried disabling filter. I have enabled embedding because I want face recognition, and implementing it later. I was really worried why it is so inaccurate(large boxes, and detecting faces in empty spaces). Thanks, i will later enable mesh. But i need really high speed on cpu, is it faster(or equal to) face api.js in speed?

vladmandic commented 3 years ago

yes, it's actually faster than face-api (even if human mesh is far more detailed than face-api) if you're doing video analysis as there is extensive bounding boxes caching behind the scenes, so a lot of adjustments can be done with quick re-calculations on-the-fly instead of re-running full model for each frame (that's what videoOptimized config flag is for). and for image analysis, it's about the same as face-api.

also, for performance reasons, you can enable/disable calculations for face large angles (if face is nearly-vertical or within 20-30 degrees, you can have face.detector.rotation config flag set to false and only enable additional math if expected faces are under high angles).

basically, i've started human after i've ported face-api (@vladmandic/faceapi) to latest typescript and tensorflow (wasn't easy), but then started hitting other limitations.

HemantKumar01 commented 3 years ago

the no bundle version is working correct with filter: { enabled: false }. the problem is solved for me as i don't need any filter. while using it with video, it is calculating the data just once. do i need to call the human.detect() function many times(say by requestAnimationFrame) also in a video? currently i am doing that and it's working very accurate with lightning speed. also there is no source map for no bundle version, so should i use human.esm.json? thanks for your help

vladmandic commented 3 years ago

i'm glad it helped. i still want to figure out why fx got deallocated when using nobundle version, but i can do that in the background.

regarding sourcemap, not sure i understand - it's there, dist/human.esm-nobundle.js is paired with dist/human.esm-nobundle.map?

regarding video, yes, you need to call it in a loop for each frame.
internally, it does a lot of caching so it skips some processing between frames and instead just recalculates positions - that's what 'config.videoOptimized = true' config flag is for (enabled by default).

vladmandic commented 3 years ago

fyi, i've just redone declarations for imagefx module (human.fx), hope that helps with missing object when using nobundle version but since i cannot reproduce the problem, i cannot be sure.

HemantKumar01 commented 3 years ago

NO, it didn't worked! i have downloaded the new human.esm-nobundle.js and human.esm-nobundle.js.map , but after settiing filter:{enabled:true,} it is again giving error. this time i have used webpack development mode, and so got some more details-

the error

Uncaught (in promise) TypeError: Cannot read property 'fx' of undefined
    at z1 (human.esm-nobundle.js:31)
    at eval (human.esm-nobundle.js:750)

chrome debugger is pointing here(also check my next comment's screenshot)-

image

the formatted code of above image(some part)-

     if ((!this.fx || !N || E.width !== N.width || E.height !== N.height) && (N = typeof OffscreenCanvas != "undefined" ? new OffscreenCanvas(E.width, E.height) : document.createElement("canvas"), N.width !== E.width && (N.width = E.width), N.height !== E.height && (N.height = E.height), this.fx = q.ENV.flags.IS_BROWSER ? new z0({
          canvas: N
        }) : null), !this.fx) return E;
HemantKumar01 commented 3 years ago

IMPORTANT

it is now even not working with filter disabled, which was working previously. Now, giving the same error as filter enabled was giving.

important- check this another screenshot

image

How can i again get the previous files (is it the one updated 2 moths ago?) ?

vladmandic commented 3 years ago

i found the issue and hopefully fixed it, new version is published.
now that i see the issue, i wonder how it works without errors on my system!

HemantKumar01 commented 3 years ago

Yes, it's now working alright, as expected, even with filter enabled. thank you so much

vladmandic commented 3 years ago

thanks for the patience and the confirmation