Angular lag when playing video

I use angular and firebase , retrieve video on firebase storage , then display it. But when the video starts playing the app starts to lag. How can i fix it. (I uploaded the video manually)

Retrieve data :

downloadUrl : any
this.downloadUrl =  this.FireStorage.refFromURL("https://firebasestorage.googleapis.com/v0/b/*****").getDownloadURL();

template:

<div layout="column" flex *ngIf="downloadUrl | async; let url"  >
  <video layout-fill loop="loop"  autoplay="autoplay" preload="auto">
  <source [src]="url" alt="Image from AngularFireStorage" type="video/mp4"/>
  </video>
</div>