Работа с аудио в Safari на IOS

Пишу WebGL-приложение с использованием Three.js. В приложении есть фоновая loop-мелодия, а так же при клике на некоторые интерактивные элементы воспроизводится звук (иногда по 5-7 секунд).

Все работает идеально, но в Safari на IOS со временем перестает играть фоновая мелодия и возвращается через 5-45 секунд. Погуглив я нашел такую особенность Safari под IOS:

Одно из самых серьезных ограничений мобильной версии Safari состоит в том, чтоединовременно может воспроизводиться только один аудиопоток. Медиаэлементы HTML5в mobile Safari являются синглтонами, поэтому может воспроизводиться лишь один потокHTML5 audio (и HTML5 video).

Однако несколько звуков одновременно воспроизводятся и какое-то время все работает нормально.

Так же Safari дает воспроизвести звук только если юзер кликнул по странице:

userInteraction(){
    if(!this.listener){
      this.listener = new this.THREE.AudioListener();
      // HACK FOR IOS
      const mediaElement = new Audio( './sounds/soundtrack.mp3' );
      mediaElement.loop = true;
      mediaElement.play();
      this.mainTheme = new this.THREE.Audio( this.listener );
      this.mainTheme.setMediaElementSource(mediaElement);
      this.mainTheme.setVolume( Math.ceil(this.musicVolume) / 100 );
      this.mainTheme.setLoop( true );
      this.mainTheme.play();
    }
  }

mainTheme добавлено через mediaElement, ибо иначе звук не работает вообще, можно сказать хак, не знаю.

После добавления mediaElement остальные звуки работают и вызываются вот так:

  playSound(key){
    const sound = new this.THREE.AudioExt( this.listener );
    sound.setBuffer( this.sounds[key] ); // SO: this.sounds - загруженные звуки
    sound.setVolume( Math.ceil(this.effectVolume) / 100 );
    sound.play();
  }

Собственно, почему mainTheme перестает играть и как это исправить?

P.S. На Android и ПК в Firefox/Chrome все работает прекрасно.