搜索

首页  >  问答  >  正文

javascript - 关于jquery的load()同步阻塞

现在要在一个主页面中分别加载页头和页尾,用iframe性能不好,纯html页面所以也不能用php的include方法直接加载页面,React、angular这些框架的模板导入我也还没学过,所以想来想去只能jquery的load()加载进来,现在的问题是load方法会造成同步的主线程阻塞问题,页面体验很不好。

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

现在我的问题是:
1.load方法不能像$.get或$.post这些ajax方法一样设置成异步加载,从而避免阻塞主线程吗?我要怎么解决load()造成的主线程阻塞问题?
看过相关资料,用h5的Worker好像可以避免主线程阻塞,是不是只有这种方式能解决,worker没用过。

2.针对我这种需求,除了我文中说的这几种方式外,就目前我的情况来说应该怎么解决,公司开发中哪种方式解决页头页尾加载最好呢?

欢迎大家的帮忙解决,谢谢!

天蓬老师天蓬老师2778 天前678

全部回复(3)我来回复

  • 滿天的星座

    滿天的星座2017-05-19 10:22:45

    load()默认就是异步加载的,不会造成主线程阻塞。所以警告中的同步阻塞问题不是这里单一的load()造成的。我后来查了子页面,发现子页面中有<script src="*">,。于是去掉了子页面中的外部js引入,警告就没有了。所以是load()和子页面中的外部js引入造成的同步阻塞警告。

    回复
    0
  • ringa_lee

    ringa_lee2017-05-19 10:22:45

    1.此方法的底层调用的是$.ajax()方法,对服务端进行ajax请求。所以默认就是异步加载的,不会造成主线程阻塞。
    。不过因为默认就是异步加载,所以就可能出现这种情况,页面主体部分先显示出来,而后服务端的页头,页尾数据才返回过来并插入页面中,导致页面主体部分,页头,页尾不同时出现,会闪一下。
    2.我遇到的情况是页头页尾搭配相对固定的情况,因此可以做一个模板页面,页头和页尾写死在其中,而后页面的主体部分嵌入iframe,根据情况设置iframe的地址指向相应的具体页面。

    回复
    0
  • 某草草

    某草草2017-05-19 10:22:45

    1当然可以.

    var html = $.get('xx.yy');
    $('selector').html(html);
    

    2.我一般是头和尾,加上content,会做成base.html,php用的时候会extend base.html

    回复
    0
  • 取消回复