vue.jsでcanvasを使用し、画像を連続表示する際に、画像を読み込んでいる最中は別の処理を走らせておきたい場合

Question

vue.jsでcanvasを使用し、画像を連続表示する際に、画像を読み込んでいる最中は別の処理を走らせておきたい場合には、どのようにしたらいいのでしょうか？

top画面ではグラデーションのかかったエフェクトを使用しているのですが、
canvasに描画するための画像読み込みの部分で時間がかかり、その間グラデーションが動かない状態になってしまいます。

class App {
  constructor () {
    this.loadCount = 0
    this.imgArr = []
  }

  function _handleLoad (self) {
    if (++self.loadCount === 100) {
     self.loadFinished(imgArr) // <= ここに入った時点でグラデーションが効くようになる
    }
  }

  // 画像読み込み
  load () {
    var self = this

    for (var i = 0; i <= 100; i++) {
      var imgName = './sample' + i + '.jpg'
      var req = require.context('../images/', false, /^./.*.jpg$/)

      imgArr[i] = new Image()
      imgArr[i].onload = _handleLoad(self)
      imgArr[i].onerror = _handleLoad(self)
      imgArr[i].src = req(imgName, false)
    }
  }
  .
  .
  .
  .
}
app = new App()
app.load