其次,查看出现延迟问题的业务页面和不出现延迟的业务页面对这一组件的调用区别。

通过对比,也没有发现两个组件有何不同。(故这一奥秘,有兴趣的同学可以联系我一起讨论。。。。。我可以把源码发给你)

经过多次的重现问题,明显看到在pc的chrome,使用touch模式延迟偶尔消失,而使用mousewheel延迟又出现。故将问题定位到mousewheel事件 和其相近对应的 scroll事件中。

bug解决:

结合上诉原因并通过查看的几个帖子讨论,得出如下结论:

1.chrome浏览器的mousewheel事件是引起这一延迟的原因(mousewheel事件不是标准事件,不推荐大家使用),当然!代码中我并没有使用mousewheel事件,但是使用scroll事件就可能会引起mousewheel事件的冲突,而在我们特质的手机客户端中的webview不幸的也命中了这一缺陷。

2.想要解决这个问题,可以尝试监听这一事件(如果浏览器没有这一事件,也不会响应这一监听,没有冲突),并在事件触发的时候,取消其所有默认行为:

故通过监听其事件模型的 deltaY(鼠标垂直滚动量)当其有垂直位移的时候,触发preventDefault,故代码如下:

window.addEventListener("mousewheel", (e) => {
  if (e.deltaY === 1) {
    e.preventDefault();
  }
})

兼容性问题的本质:

webkit架构中,有一些模块在浏览器中是普遍不共享的,有一些模块在浏览器中是某些特性不共享的,而且可以通过不同的编译配置改变它们的行为。所以,很多使用webkit的浏览器可能会表现出不同的行为。

以上所述是小编给大家介绍的解决Ajax的content-download时间过慢问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!ajax的content-download时间过慢问题的解决与思考

ajax的content-download时间过慢问题的解决与思考的更多相关文章

  1. 关于ajax的content-download时间过慢问题的解决方案与思考

    前言:   做前端架构很久很久了,经常到我这里都是些棘手的问题,之前没有养成很好的记录问题的习惯,以后会努力成文,积累. 于是今天就有个这篇文章.关于ajax的content-download时间过慢 ...

  2. 优化vue+springboot项目页面响应时间:waiting(TTFB) 及content Download

    优化vue+springboot项目页面响应时间:waiting(TTFB) 及content Download TTFB全称Time To First Byte,是指网络请求被发起到从服务器接收到地 ...

  3. 【转载】Extjs设置Ajax请求的超时时间timeout

    在Extjs中的Ajax请求中,Ext.Ajax.request 默认超时时间是30秒,有时候我们有比较耗时的操作需要设置更长时间,此时我们就需要修改Ext.Ajax.Requset的超时时间为更长, ...

  4. jquery.ajax的url中传递中文乱码问题的解决方法

    jquery.ajax的url中传递中文乱码问题的解决方法   JQuery JQuery默认的contentType:application/x-www-form-urlencoded 这才是JQu ...

  5. 02基于注解开发SpringMVC项目(jar包,异步,request,参数传递,多选的接收,Model传参,map传参,model传参,ajax,重定向,时间日期转换)

     1 所需jar包 项目结构如下: 2 web.xml配置文件的内容如下: <?xmlversion="1.0"encoding="UTF-8"?&g ...

  6. ajax异步服务器获取时间

    1.创建ajax对象 <script type="text/javascript"> //创建AJAX异步对象 function createAJAX(){ var a ...

  7. 通过原生js的ajax或jquery的ajax获取服务器的时间

    在实际的业务逻辑中,经常是与时间相关的,而前端能获得的时间有两个:客户端的时间,服务器的时间. 客户端时间通过 javascript中的Date对象可以获取,如 var dt = new Date() ...

  8. ajax post提交form表单 报400错误 解决方法

    昨天晚上做项目遇到了一个奇怪的问题,我用ajax提交一个form表单,后台Java方法用的是一个实体接,但是他根本不进方法体中,直接给我一个400的错误,一开始我以为是我路径的问题(尴尬),结果直接访 ...

  9. jquery ajax 返回值 中文时乱码或变成问号解决方法

    转载自jquery的 ajax返回值为中文时乱码解决方法 用jquery的ajax,遇到个问题,服务器端从数据库取到的数据没有出现中文乱码问题(日志打出来是没有乱码的),但是异步传到客户的时候却出现了 ...

随机推荐

  1. Mac下快速新建txt文件

    1.打开终端,定位到桌面 cd desktop 2.输入 vi test.txt 此时,一个txt文件就会建立在桌面上,操作vi时的提示:按[i]为输入内容,编辑好之后按[esc]键,然后输入[:wq ...

  2. 修改docker的port端口映射

    原以为修改docker的端口映射只是一条命令就可以搞定,结果发现没那么简单,记录一下以防忘记.1. 查看需要修改的容器,记住container iddocker ps -a2. 停止容器docker ...

  3. 第1章—Spring之旅—容纳你的Bean

    容纳你的Bean 在基于Spring的应用中,你的应用对象生存于Spring容器中.Spring负责创建对象,装配他们,配置他们并管理他们整个生命周期,从生存到死亡(在这里 可能是new 到 fina ...

  4. python四种简单排序

    #!/usr/bin/python #排序方法 #冒泡排序 def buble(l): for i in range(len(l)): for j in range(len(l)-i-1): if l ...

  5. bug: 1.eclipse 中tomcat server 变灰色 2.build path 添加的jar不识别

    1.网上百度的方案试过,没有作用. 最后删掉tomcat重新解压配置解决. 确保工程属性栏中,server正确才可加载tomcat. 猜测可能原因,tomcat在eclipse有时崩溃,一般做法是将s ...

  6. Node.js之Console用法小结

    /** * Created by city--online on 16/3/9. */ //console.time()和console.timeEnd()输出中间代码的执行时间(注意:time和ti ...

  7. webpack初识!

    最近在使用webpack 感觉棒棒哒 下面这个简单的教程可以让你走入webpack的世界 欢迎使用webpack 这个小教程通过简单的例子来引导大家使用webpack 通过这些这篇文章你可以学到 如何 ...

  8. Devexpress GridView增加CheckBox列

    参考DEV官网代码做了一个增加checkbox列效果: #region 方法:设置GridView数据绑定        public void GridDataBind()        {     ...

  9. Linux NTP时间服务器

    NTP 时间服务器 ntp也是一种协议 ntp软件(支持ntp协议)  CentOS6自带 CentOS7需要安装 chrony软件(支持ntp协议)   CentOS7自带 安装ntp CentOS ...

  10. Java - 用静态工厂方法代替构造器

    Effective Item - 考虑用静态工厂方法代替构造器我们有两种常见的方法获得一个类的实例: 公有的构造器 提供静态工厂方法(static factory method) 相对公有的构造器,静 ...