首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

IE页面加载慢.

场景 场景是大屏页面一张深色背景, 里面一些文本元素以及图表展示. 结果在IE下发现加载异常缓慢, 还有部分人员反馈页面卡死....访问一张带背景图的表单, 可以看到内容是先渲染出来的, 然后是加载图片. 图片是一段一段的加载的, 并不会影响内容主体渲染, 也不是导致初始页面空白的元凶....IE与Gzip 如果不是图片导致的加载慢, 为什么很多小伙伴反馈大屏慢呢? IE以及Edge似乎更卡一点.  我们用Chrome访问一张大屏模板, 对比下IE访问模板的响应时间....op=fs_main&cmd=entry_report&id=2571 截图一看清楚了, IE里看上去Gzip就没起作用, 实实在在的加载原js. 用了4s才加载完....重复上述访问entry操作, 等得的快炸的时候, 页面终于加载出来了. 低速网络下, 两个js累计加载耗时561s!!!

2.4K70

selenium之等待页面(或者特定元素)加载完成

文章目录 需求: 1、显示等待(推荐) 2、隐式等待(也不错) 3、time.sleep(一般不推荐) 需求: 有时候,我们使用selenium用来获取一些元素时,需要等待页面将某些元素加载网站才能够获取我们需要的数据...,所以,这时候我们就需要等待页面的功能。...1、显示等待(推荐) 显式等待是你在代码中定义等待一定条件发生后再进一步执行你的代码。 最糟糕的案例是使用time.sleep(),它将条件设置为等待一个确切的时间段。...(也不错) 如果某些元素不是立即可用的,隐式等待是告诉WebDriver去等待一定的时间后去查找元素。...默认等待时间是0秒,一旦设置该值,隐式等待是设置该WebDriver的实例的生命周期。

5K20
您找到你想要的搜索结果了吗?
是的
没有找到

domReady的理解

当整个页面及所有依赖资源如样式表和图片都已完成加载时,将触发load事件。不使用动态加载的同样会阻塞load事件,此外即使是异步加载的标签同样会阻塞load事件。...在各种条件下重新整理一下页面加载的过程,主要是在于DOMContentLoaded事件与load事件触发的时间线: 自上而下,首先解析HTML标签,生成DOM Tree,此时document.readyState...解析到没有设置异步加载的的时候,阻塞文档解析,等待Js脚本加载并且执行完成后,才会继续解析文档。...等待设置为async属性的以及图片与等加载,直至页面完全加载完成。 load事件触发,document.readyState = "complete"。...如果是小于525版本的Webkit则通过轮询document.readyState来实现。 对于旧版本的IE浏览器使用Diego Perini发现的著名hack。

99131

JavaScript之Ajax

简介:AJax是在2005年被Adaptive Path的Jesse James Garrett发明的,用户概括异步加载页面内容的技术---说通俗点,Ajax就是实现局部页面通过JavaScript与后台服务器交互...,并刷新页面的功能。...这一点在IE中就很明显,不同的IE浏览器创建XMLHttpRequest对象的代码不同微软最早在IE5中以ActiveX名叫XMLHttp的对象,所以在IE中创建新的XMLHttp对象的代码就应该这样写...属性的值,它有5个可能的值: 0表示初始化 1表示正在加载 2表示加载完毕 3表示正在交互 4表示完成 只要readyState属性值变成了4,就可以访问服务器发送回来的数据了; 4、访问服务器发送回来的数据要通过两个属性来完成...3、重点:就是异步请求有一个容易会被忽略的问题,就是异步性,就是脚本在发送XMLHttpRequest请求之后,仍然会继续执行,不会等待响应返回。

79570

Js框架设计之DomReady

2、HTML是要通过浏览器解析之后才会转换成为DOM节点 一般地,但我们向浏览器中输入一个地址,开始加载页面到我们看到页面的内容为止,这期间就有一个DOM节点构建的过程(浏览器将HTML标签转换为DOM...iframe,他不会堵塞Dom构建,但是它会在加载DOM时和其他标签争抢资源(因为iframe会发送http请求,但是http请求有限),们经常看到一些新闻网,上面会挂许多iframe广告, 这些页面一开始加载时就很卡...- 载入完成 逻辑: 1、首先通过document.readyState判断DOM节点的加载情况,如果文档加载完成(HTML标签转换成DOM节点)document.readyState...=complete 那么直接执行Dom.beforeReady()方法 2、如果文档没有加载完成,且浏览器是不是IE,那么 */ var Dom = [];...fn(); else Dom.push(fn); } //页面加载完毕(readyState="complete")立即执行当前函数 Dom.beforeReady

1.5K60

剖析XMLHttpRequest对象理解Ajax机制

readyState属性   当XMLHttpRequest对象把一个HTTP请求发送到服务器时将经历若干种状态:一直等待直到请求被处理;然后,它才接收一个响应。...ReadyState取值 描述 0 描述一种"初始化"状态;此时,已经创建一个XMLHttpRequest对象,但是还没有初始化。...当readyState为4(已加载)时,该responseText包含完整的响应信息。   ...而且,仅当readyState值为3(正在接收中)或4(已加载)时,这个status属性才可用。当readyState的值小于3时试图存取status的值将引发一个异常。   ...当服务器响应时,在接收消息体之前,如果存在任何消息体的话,XMLHttpRequest对象将把readyState设置为3(正在接收中)。当请求完成加载时,它把readyState设置为4(已加载)。

1.3K20

onload 和 domready

博客地址:https://ainyi.com/46 window.onload 事件会在页面或图像加载完成后触发(即所有元素的资源都下载完毕) 如果页面上有许多图片、音乐或 falsh 还没加载完成,onload...事件快许多,它是在 DOM 准备完毕后触发(不需等待资源下载完毕) DOMContentLoaded 事件在许多 Webkit 浏览器以及 IE9 上都可以使用,此事件会在 DOM 文档准备好以后触发...一样,会在页面或图像加载完成后触发(即所有元素的资源都下载完毕),但是: FireFox 的 script 元素不支持 onreadystatechange 事件,只支持 onload 事件 IE 的...script 元素支持 onreadystatechange 事件,不支持 onload 事件 在 IE 下,可以使用 onreadystatechange 完成 onload 事件,判断 readyState...' || document.readyState === 'loaded') { alert('dom 和资源下载完毕') } } 博客地址:https://ainyi.com/46

2.6K20

Ajax详解

这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 1:方法 xmlHttpRequst对象利用send()和open()方法与服务器进行交互。...0: 请求初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成,且响应已就绪 State 200: "OK" 404: 未找到页面 responseText 获得字符串形式的响应数据...通过xmlhttpRequest对象执行操作,其中xmlhttpRequest对象是在浏览器中内置的一个对象 其运行原理就相当于创建了一个请求代理,通过代理去完成与服务器的交互,交互的过程中客户不需要等待..., Opera, Safari创建方式 xmlhttp=new XMLHttpRequest(); } else {// IE6, IE5 创建方式 xmlhttp=new...(xmlhttp.readyState==4 && xmlhttp.status==200) { //操作页面元素 document.getElementById("myDiv

84390

Ajax之路

Ajax:使用ajax技术不用刷新整个页面,只需对局部页面进行刷新。也就是说用XHR对象取得新数据,然后通过DOM方式将新数据插入到页面中,达到局部更新的效果。   ...Ajax优点: 减少冗余请求,节省网络带宽,提高网页加载效率,从而缩短用户等待时间,促进页面与数据分离,提高用户体验   Ajax缺点: Ajax干掉了浏览器后退机制(back按钮); 特定页面很难加入收藏夹...+,Firefox,chrome,Opera,Safari等现代浏览器执行代码 4 xhr=new XMLHttpRequest(); 5 }else{ 6 //IE6,IE5浏览器执行代码...readyState:表示XMLHttpRequest的状态(0,1,2,3,4):   0:请求初始化; 1:服务器连接已建立; 2:请求已接收; 3:请求处理中; 4:请求已完成,响应已就绪...status: 常见200(“OK”),404(未找到页面) 1 xhr.onreadystatechange=function(){ 2 if (xhr.readyState==4 && status

1.1K80

【AJAX】对于AJAX 解析已经XMLHttpRequest对象对于异步的操作等等在项目中的体验

AJAX的最大优点是它可以与服务器交换数据并更新某些网页,而无需重新加载整个网页。 AJAX不需要任何浏览器插件,但用户需要允许JavaScript在浏览器上执行。...这意味着可以在不重新加载整个页面的情况下更新页面的某些部分。...使用AJAX,JavaScript不需要等待服务器的响应,而是: 等待服务器响应时执行其他脚本 准备就绪后处理响应 xmlDoc=xmlhttp.responseXML; txt=""; x=xmlDoc.getElementsByTagName...请记住,JavaScript将等待服务器响应准备好继续。如果服务器忙或慢,应用程序将挂起或停止。...只要readyState发生更改,就会触发onreadystatechange事件。 readyState属性存储XMLHttpRequest的状态信息。

1.6K60

【Web性能】Javascript 代码性能优化条目(一)

因此,避免这种情况,你需要向页面中逐步加载JS文件。 无阻塞脚本的好处在于页面加载完成后才会加载JS代码。即,在window.load事件触发后才会下载脚本。...区别在于执行时机,async是加载完成后自动执行,defer需要等待页面完成后执行。...当中的内容没有全部加载完成,IE可能会抛出一个“操作已终止”的错误信息。 使用动态脚本加载文件,返回的代码通常会立即执行。但是,当代码只包含供页面其他脚本调用的接口时,就会出问题。...IE下,readyState的值并不一致,有事到达loaded状态不会到达complate;有时甚至不经过loaded就到达complate。...) { script.onreadystatechange = function() {//IE if(script.readyState == "loaded" || script.readyState

50020

原生JS实现一个Ajax跨域请求

所谓异步交互,就是指指发送一个请求,不需要等待返回,随时可以再发送下一个请求。同步交互与异步交互的区别在于同步交互需要等待结果,而异步交互不需要等待。...举个简单的例子就是当点击某个按钮后,程序会去请求一些数据,而这个过程整个页面是不会刷新的。如下图所示,异步获取一言并且显示在页面中 ?...谷歌、火狐、safari等浏览器 使用new XMLHttpRequest()的方式进行创建 IE 7+ 使用new ActiveXObject("Msxml2.XMLHTTP")方式进行创建 IE 6...关于readyState一共有五种状态, 0 初始化 1 open()方法被调用 2 send()方法被调用 3 正在相应 4 相应完毕 而响应码指的是网络请求返回的状态码,通常有200,301,404...但是只有当刷新页面时才会更新一言,因此我们需要在做一个按钮,用来获取一言。

3.3K30

json与js时间线

json 异步加载js js加载的缺点:加载工具方法没必要阻塞文档,过得js加载会影响页面效率,一 旦网速不好,那么整个网站将等待js加载而不进行后续渲染等工作。...只有IE能用,也可以将代码写到内部。 2.async 异步加载加载完就执行,async只能加载外部脚本,不能把js写在script 标签里。...1.2 执行时也不阻塞页面 3.创建script,插入到DOM中,加载完毕后callBack,js时间线 复制代码 js时间线 1、创建Document对象,开始解析web页面。...这个阶段document.readyState = 'loading'。 2、遇到link外部css,创建线程加载,并继续解析文档。...3、遇到script外部js,并且没有设置async、defer,浏览器加载,并阻塞,等待js 加载完成并执行该脚本,然后继续解析文档。

4.5K10

高性能的JavaScript--加载和执行

JavaScript运行了多长时间,那么浏览器空闲下来响应用户输入之前的等待时间就有多长。 从基本层面说,这就意味着标签的出现使整个页面因脚本解析、运行出现等待。...不论实际的JavaScript代码是内联的还是包含在一个不相干的外部文件中页面下载和解析过程必须停下,等待脚本完成这些处理,然后才能继续,也是页面生命周期必不可少的部分,因为脚本可能在运行过程中修改页面内容...为避开这种情况,你需要向页面中逐步添加JavaScript,某种程度上说不会阻塞浏览器。 非阻塞脚本的秘密在于,等页面加载之后,再加载JavaScript源码。...IE 会发出一个readystatechange事件。元素有一个readyState属性,它的值随着外部下载的过程而改变。readyState有5种取值。...){ //IE 5 script.onreadystatechange = function(){ 6 if (script.readyState == "loaded" || script.readyState

76220

AJAX的基本原理及实例解析。

什么是Ajax讨论1075083208   Ajax 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。   ...DOM——对已载入的页面进行动态更新。   XML——数据交换格式。   XSLT——将XML转换为XHTML(用CSS修饰样式)。   ...对象状态值有以下几个:   0 - (初始化)还没有调用send()方法   1 - (载入)已调用send()方法,正在发送请求   2 - (载入完成)send()方法执行完成   3 - (交互...XHR对象由IE5率先引入,在IE5中XHR对象是通过MSXML库中一个ActiveX对象实现的,根据IE版本不同可能会遇到不同版本XHR对象,而IE7+与其它现代浏览器均支持原生的XHR对象,在这些浏览器中我们只需使用...通过 AJAX,JavaScript 无需等待服务器的响应,而是:   在等待服务器响应时执行其他脚本   当响应就绪后对响应进行处理   当使用 async=true 时,规定在响应处于 onreadystatechange

94830

【AJAX】AJAX技术详细解析以及实例

这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。...这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。...XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参数必须设置为 true: 通过 AJAX,JavaScript 无需等待服务器的响应,而是:...0: 请求初始化-对象已建立,但是尚未初始化(尚未调用open方法) 1: 服务器连接已建立-对象已建立,尚未调用send方法 2: 请求已接收- send方法已调用,但是当前的状态及...演示结果: 返回结果为200-正确的页面: ? 返回结果为500-错误的页面: 让servlet出一个异常就可以模仿出来了。 例如:int a=12/0; ?

1K10

高性能JavaScript-JS脚本加载与执行对性能的影响

脚本加载优化 1.1 脚本位置对性能的影响 优化页面加载性能的原则之一是将script标签放在body底部,这跟浏览器的渲染原理有关: js脚本的下载和执行会阻塞浏览器的解析。...在较早时期,浏览器不支持并行下载的时候,js脚本的下载执行按照在html文档中的位置依次进行,可以想象当页面有大量js脚本时页面加载有多慢; js脚本的下载会阻塞其他资源的下载,比如图片、外链css等...1.2 合并脚本文件 每个script标签都会阻塞页面的解析和其他资源的加载,可以通过合并js脚本文件进行优化。...之所以将动态script标签插入head而不是body中是因为在低版本IE中如果在html文档解析完毕时,body中插入script标签会抛出“操作已终止”的错误信息。...当readyState的状态为loaded或complete时便可以认为js脚本文件已加载完毕。

1.9K91

Ajax请求的五个步骤

这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。而传统的网页(不使用 Ajax)如果需要更新内容,必需重载整个网页面。...2、同步与异步的区别 同步提交:当用户发送请求时,当前页面不可以使用,服务器响应页面到客户端,响应完成,用户才可以使用页面。...异步提交:当用户发送请求时,当前页面还可以继续使用,当异步请求的数据响应给页面页面把数据显示出来 。...浏览器.其中ActiveXOject并不是Windows对象的标准属性,而是IE浏览器中专有的属性,可以用于判断浏览器是否支持ActiveX控件.通常只有IE浏览器或以IE浏览器为核心的浏览器才能支持Active...初始化状态。在创建完XMLHttpRequest对象时,该对象处于初始化状态,此时XMLHttpRequest对象的readyState属性值为0。 初始化状态。

2.2K30

AJAX-前后端交互的艺术

分析1:这种方式浪费了很多资源和带宽,很多情况下,返回的页面大部分HTML代码是一致的 分析2:客户在服务器处理请求期间,只能等待,不能进行操作 AJAX方式:AJAX可以只向服务器发送请求,并且取回必要的数据...,这样的话,每次分页都会刷新整个页面,导致已经成功显示的头部信息,以及左侧固定信息,重新从服务器中获取,造成了带宽和服务器资源的损耗,同时用户也增加了等待时间, 如果我们通过 “AJAX方式” 实现内容分页...,在此期间可以进行任何操作 简单概述流程: 同步:发送请求 → 等待服务器处理 → 返回 异步:事件触发 → 服务器处理 (不等待)→ 处理结束 (2) 异步的好处 AJAX 就是一种可以在无需重新加载整个网页的情况下...,这也正是局部刷新所带来的问题,不过现在有一些方式可以尽可能弥补这些问题 移动端对 AJAX 的支持没有那么好 (二) 应用场景 ① 搜索框联想列表 ---- ② 局部刷新分页效果 ---- ③ 同页面加载更多数据...= xhr.responseText; alert(responseText); } } 状态 描述 readyState=0 请求初始化:在创建XMLHttpRequest对象之后

1.8K10
领券