Медленно загружаемое видео в главном слайдере начальной загрузки после добавления статического файла в приложение amazon S3.in django

Question

Мой видеоклип (в приложении Djando) в купленной начальной загрузке theme медленно загружается после добавления статических файлов в amazon S3.Каждые 2 секунды происходит пауза в загрузке.Как решить такую ​​проблему?Существуют ли специальные ведра для обработки таких файлов?Уменьшить видео?Изменить тип файла?Как проверить, хорошо ли отображаются другие пользователи.

templates.html

    <!-- Hero-->
    <section class="module-cover parallax fullscreen text-center" id="home" data-background="{% static 'assets/video/video_massage.png' %}" data-jarallax-video="mp4:{% static 'assets/video/video_massage.mp4' %},webm:{% static 'assets/video/video_massage.webm' %},ogv:{% static 'assets/video/video_massage.ogv' %}" data-overlay="0.45">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="m-b-20"><strong>Szukasz najlepszego <br> masażysty?</strong></h1>
                    <p class="m-b-40">Skorzystaj z jedynego w swoim rodzaju studia masażu wschodniego Kashima.  <br> Zrelaksuj się, odpręż i wypełnij swoje ciało nową energią.</p>
                    <a class="btn btn-lg btn-circle btn-outline-new-white" href="#" data-toggle="modal" data-target="#modal-2">Umów się na spotkanie</a></p>
                </div>
            </div>
        </div>
    </section>
    <!-- Hero end-->

Размер файла (используется в templates.html):

OGV movie - 17,9 MB time(54 second)

MP4 movie - 32,7 MB time(54 second)

WEBM movie - 12,9 MB time(54 second)

После добавления на YouTube мой кот выглядит так:

    <section class="module-cover parallax fullscreen text-center" id="home" data-background="{% static 'assets/video/video_massage.png' %}" data-jarallax-video="https://www.youtube.com/watch?v=KnaYSHZTzCk&feature=youtu.be" data-overlay="0.45">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="m-b-20"><strong>Szukasz najlepszego <br> masażysty?</strong></h1>
                    <p class="m-b-40">Skorzystaj z jedynego w swoim rodzaju studia masażu wschodniego Kashima.  <br> Zrelaksuj się, odpręż i wypełnij swoje ciało nową energią.</p>
                    <a class="btn btn-lg btn-circle btn-outline-new-white" href="#" data-toggle="modal" data-target="#modal-2">Umów się na spotkanie</a></p>
                </div>
            </div>
        </div>
    </section>

settings.py

MEDIA_URL = '/media/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'app/media')

CRISPY_TEMPLATE_PACK = 'bootstrap4'

#<-------------Elements Amazon3S --------->
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'app/static'),
]

AWS_ACCESS_KEY_ID = ''
AWS_SECRET_ACCESS_KEY = ''
AWS_STORAGE_BUCKET_NAME = 'massage-app'
AWS_S3_CUSTOM_DOMAIN = '%s.s3.amazonaws.com' % AWS_STORAGE_BUCKET_NAME

AWS_S3_OBJECT_PARAMETERS = {
    'CacheControl': 'max-age=86400',
}

AWS_LOCATION = 'static'
STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'
STATIC_URL = "https://%s/%s/" % (AWS_S3_CUSTOM_DOMAIN, AWS_LOCATION)

DEFAULT_FILE_STORAGE = 'app_rama.storage_backends.MediaStorage'
#<-------------Elements Amazon3S end -------------->