本机chrome加载jekyll博客页面DOM非常慢、但是其他浏览器和虚拟机中的chrome正常

发布于 2022-09-02 01:49:05 字数 2022 浏览 27 评论 0

jekyll的博客在chrome中突然出现DOM加载非常慢的情况,导致CSS的所有animation和transition缓慢,但是该问题只出现在了中文博客,所有的英文博客内容加载正常。

本机MAC chrome加载不正常,但是firefox和safari上都显示正常,CSStransition和animation也正常。并且,在虚拟机ubuntu和win8中尝试,chrome也加载正常。
已经尝试过卸载重装本机chrome,依然没有解决问题,查看develop tool似乎因为中文字体的原因font-awesome加载延后。

所有jquery的事件

var scroll = $('.toggle-span');
      var wrapper1 = $('#mainpage');
      var wrapper2 = $('.wrapper2');
      var maincontent = $('#main-content');
      var side = $('.col-md-4');
      var collpas = $('.toggle-span2');


      scroll.click(function(){
        // wrapper1.removeClass('wrapper').addClass('wrapper2');
        side.css('display','block');
        $(this).css('display','none');
        collpas.css('display','block');
        maincontent.removeClass('inner').addClass('col-md-8');
        
      })

      collpas.click(function(){
         maincontent.removeClass('col-md-8').addClass('inner');
         side.css('display','none');
         scroll.css('display','block');
         $(this).css('display','none');
      })

      $(window).scroll(function(){
        scroll.css('top',Math.max(60,150-$(this).scrollTop()));
      })

CSS的transition

#main-content{
    @media (min-width:991px){
    -webkit-transition: padding 0.5s ease-out;
    -moz-transition: padding 0.5s ease-out;
    -o-transition: padding 0.5s ease-out;
    -ms-transition: padding 0.5s ease-out;
    transition: padding 0.5s ease-out;

    -webkit-transform: translateZ(0);
    transform:translateZ(0);
    transform: translate3d(20px, 20px, 0px)
    }
}

同样的网页,本机chrome加载network截图
chrome中network截图

如上页面加载,下面这个事本机firefox中的network截图
图片描述

跪求解决方案 页面链接、请点我

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

邮友 2022-09-09 01:49:05
$(window).scroll(function(){
  scroll.css('top',Math.max(60,150-$(this).scrollTop()));
})

用排除法吧,把可疑代码都注释了,然后再看看会不会。
先注释掉上面这块。

放手` 2022-09-09 01:49:05

之前公司同事遇到过 chrome 的加载问题,建议她先尝试禁掉所有插件后就解决了(后来逐一排除发现是广告插件捣鬼),题主不妨一试。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文