加载gif需要太长时间才能加载

Question

我有一个网站上有很多沉重的前端功能，我正在使用一个加载gif来缓解我的加载麻烦。然而我注意到，在Safari中，特别是（可能因为它通常较慢的浏览器）加载gif的背景加载然后差不多八秒钟，gif加载，此时页面的其余部分完成加载和站点出现。这似乎是对整个效果的浪费。

是否有任何方法可以让这个gif更早加载，以便在加载页面的其余部分之前播放gif？

在这里我的网站：http://bmgz.rtcgraphics.com/

谢谢！

html：

<html class="js">
    <body>
        <div id="preloader-gif"></div>
        <!-- the rest of the website -->
    </body>
</html>

CSS：

.js div#preloader-gif {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    overflow: visible;
    background: #333 url(img/ajax-loader.gif) no-repeat center center;
}

JS：

$(document).ready(function(){
    $(window).load(function(){
        $('#preloader-gif').fadeOut('slow',function(){$(this).remove();});
    });
});