Many thanks Jason, that was a valuable insight!
In my project, I have a dynamic stepper implemented as an Angular library and it has the navigation between steps with hand tracking as a feature in it.
<lib-dynamic-stepper [steps]=“steps”
[currentStep]=“currentStep”
[showGoBack]=“true”
(goBack)=“goBack()”
(gotoStep)=“onGotoStep($event)”
(gotoNextStep)=“gotoNextStep()”
(gotoPreviousStep)=“gotoPreviousStep()”>
DynamicStepperModule is used in order-creation and product-details views and is the one that is responsible for loading and releasing the hand pose model (via its HandGestureService) and not the main app (AppComponent) like in the case of the demo from Minko.
The solution that I see for my case is to release the model whenever the user leaves the details view. But I just couldn’t find the .dispose() method.
The source code that I have calls handpose.load() (as you can see in line 50 in hand-gesture.service.ts) that returns Promise and “handpose” is coming from @tensorflow-models. In line 62, there is a call to model.estimateHands(video), but both “handpose” and “HandPose” don’t have a “dispose()” method.

  

      github.com
  

  
    rakia/ng-dynamic-stepper/blob/master/projects/dynamic-stepper/src/lib/ml/hand-gesture.service.ts 5


    import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import * as handpose from '@tensorflow-models/handpose';
import '@tensorflow/tfjs-backend-webgl';
import '@tensorflow/tfjs-backend-cpu';

import { drawKeypoints } from './hand-renderer';
import { GE } from './fingere-gesture';

const GestureMap = {
  thumbs_up:  'ok',
  victory:    'two',
  one_finger: 'one',
};

type Gesture   = 'one' | 'two' | 'ok' | 'none';
type Direction = 'left' | 'right' | 'none';
type Size      = [number, number];
type Point     = [number, number];
type Rect      = { topLeft: [number, number]; bottomRight: [number, number] };



  This file has been truncated. show original