Video Flicker when streaming image blobs

When running from live, each frame is passed as an image blob. After digging into the code I noticed the image-sequence.js class never has the image data loaded (because the browser needs to load it).
So essentially what happens is componentWillReceiveProps sets state from _getCurrentFrames . This kicks off the image load promise, but returns currentFrameImage as undefined. The image subsequently is removed, then the promise callback fires and sets the new frame into state.

One potential fix for this would be to not remove the image but rather just not change the currentFrameImage if it hasn’t loaded yet.

  _getCurrentFrames(props) {
    const {currentTime, src} = props;
    const {currentFrameImage} = this.state || {}

    const currentFrame = this._buffer.set(src, currentTime);
    const currentFrameData = this._buffer.get(currentFrame);

    if (currentFrameData && !currentFrameData.image) {
      currentFrameData.promise.then(image => {
        if (this.state.currentFrame === currentFrame) {
          this.setState({currentFrameImage: image});
        }
      });
    }

    return {
      currentFrameImage: (currentFrameData && currentFrameData.image) || currentFrameImage,
      currentFrame
    };
  }

I’m happy to make a PR if this is unintended behavior / a bug. If its not can you explain how I should stream image blobs from live data?

[Pessimistress]

Fix is published in 1.0.0-beta.10.

[jruddell]

@MGraefe Great thanks! When will this be released (so I can pull down in NPM)?