Анимированный GIF не анимируется в Safari во время предварительной загрузки страницы

Question

У меня есть приложение rails с кнопкой, которая запускает отображение gif-страницы заполнения, когда выполняется какая-то долгая фоновая задача. В chrome все работает, как ожидалось, но Safari никогда не загружает анимированный gif.

Иногда Safari показывает стоп-кадр gif, но не всегда. код довольно прост

HTML / рельсы в верхней части тела

<div id="shippingLoader" style="display: none;">
  <div class="mt-5 text-center text-light">
    <h3 class="text-blue">We're searching for the best shipping rates for you!</h3>
    <%= image_tag("animations/shipping_box.gif") %>
  </div>
</div>

кнопка, запускающая загрузчик

<%= link_to 'Select Shipping Method', cart_select_shipping_path(@cart),
      class: "btn btn-success btn-block", data: {disable_with: "Loading..."},
      id: "cust_shipping_btn", onClick: "javascript:showShippingLoader();" %>

Javascript

function hideAllLoaders() {
  $('#shippingLoader').hide();
}

function showShippingLoader() {
  $('#distributorShippingModal').modal('hide');
  $('#shippingLoader').show();
}

// Hide Loader on any page load
$(window).bind("pageshow", function(event) {
  hideAllLoaders();
});

// Always timeout after 20 sec
setTimeout(hideAllLoaders, 20 * 1000);

Кажется, что только gif не загружается во время перенаправления (когда я хочу, чтобы он загружался). Если я помещаю тот же тег изображения с gif на странице за пределами всего вышеперечисленного, он анимируется в Safari, как ожидалось .