IE 下JS和CSS 阻塞后面内容总结
总结:
1. CSS 都是可以并行下载的。
2. IE6 和 IE7 JS 不能并行下载,CSS 和 JS 阻塞后面内容下载。
3. IE8 JS 还是会阻塞图片下载
开始改变加载模式,把JS 和 CSS 全部放在一起加载。
4. IE9 以后都是完美的
测试网站:http://www.webpagetest.org/
测试代码:
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<link rel="stylesheet" href="test/1.css" media="all" />
<link rel="stylesheet" href="test/2.css" media="all" />
<link rel="stylesheet" href="test/3.css" media="all" />
<script src='test/1.js'></script>
<script src='test/2.js'></script>
<script src='test/3.js'></script>
<link rel="stylesheet" href="test/4.css" media="all" />
<link rel="stylesheet" href="test/5.css" media="all" />
<link rel="stylesheet" href="test/6.css" media="all" />
</head>
<body>
<img src='images/location/p-s2-1.jpg' />
<img src='images/location/p-s2-2.jpg' />
<img src='images/location/p-s2-3.jpg' />
<script src='test/10.js'></script>
<script src='test/11.js'></script>
<script src='test/12.js'></script>
<img src='images/our-guests/1.jpg' />
<img src='images/our-guests/2.jpg' />
<img src='images/our-guests/3.jpg' />
<script src='test/4.js'></script>
<img src='images/location/p-s1-1.jpg' />
<script src='test/5.js'></script>
<img src='images/location/p-s1-2.jpg' />
<script src='test/6.js'></script>
<img src='images/location/p-s1-3.jpg' />
<link rel="stylesheet" href="test/7.css" media="all" />
<img src='images/location/b-s1-1.jpg' />
<link rel="stylesheet" href="test/8.css" media="all" />
<img src='images/location/b-s1-2.jpg' />
<link rel="stylesheet" href="test/9.css" media="all" />
<img src='images/location/b-s1-3.jpg' />
<script src='test/7.js'></script>
<link rel="stylesheet" href="test/10.css" media="all" />
<script src='test/8.js'></script>
<link rel="stylesheet" href="test/11.css" media="all" />
<script src='test/9.js'></script>
<link rel="stylesheet" href="test/12.css" media="all" />
</body>
</html>
IE6:
IE7:
IE8:
IE9:
IE10:
IE 下JS和CSS 阻塞后面内容总结的更多相关文章
- idea环境下js、css中文乱码
idea2018.2+tomcat8+java8+win10 异常:本地js和css通过tomcat发布时,在页面打印出的中文是乱码.而从数据库读取的中文数据和html的中文显示正常. 解决方法: 步 ...
- JS阻塞以及CSS阻塞
一.JS阻塞 所有的浏览器在下载JS文件的时候,会阻塞页面上的其他活动,包括其他资源的下载以及页面内容的呈现等等,只有当JS下载.解析.执行完,才会进行后面的 操作.在现代的浏览器中CSS资源和图片i ...
- 哪些地方会出现css阻塞,哪些地方会出现js阻塞?
Js的阻塞特性: 所有浏览器在下载JS的时候,会阻止一切其他活动,比如其他资源的下载,内容的呈现等等.直到JS下载.解析.执行完毕后才开始继续并行下载其他资源并呈现内容.为了提高用户体验,新一代浏览器 ...
- JS以及CSS对页面的阻塞
一.JS阻塞 所有的浏览器在下载JS文件的时候,会阻塞页面上的其他活动,包括其他资源的下载以及页面内容的呈现等等,只有当JS下载.解析.执行完,才会进行后面的 操作.在现代的浏览器中CSS资源和图片i ...
- 【对比分析五】CSS阻塞和JS阻塞
js 的阻塞特性: 所有浏览器在下载 JS 的时候,会阻止一切其他活动,比如其他资源的下载,内容的呈现等等.直到 JS 下载.解析.执行完毕后才开始继续并行下载其他资源并呈现内容.为了提高用户体验,新 ...
- 【JS】JS以及CSS对页面的阻塞
一.JS阻塞 所有的浏览器在下载JS文件的时候,会阻塞页面上的其他活动,包括其他资源的下载以及页面内容的呈现等等,只有当JS下载.解析.执行完,才会进行后面的 操作.在现代的浏览器中CSS资源和图片i ...
- 哪些地方会出现css阻塞,哪些地方会出现js阻塞?
js的阻塞特性: 所有浏览器在下载JS的时候,会阻止一切其他活动,比如其他资源的下载,内容的呈现等等. 直到JS下载.解析.执行完毕后才开始继续并行下载其他资源并呈现内容. 为了提高用户体验,新一代浏 ...
- css、js的相互阻塞
先决条件:脚本前面存在外部样式 以下试验虽然是在chrome下,但是对于IE8+以及其他浏览器也适用. 1.内联脚本(http://jsbin.com/mudab/1) <!DOCTYPE ht ...
- 原来 CSS 与 JS 是这样阻塞 DOM 解析和渲染的
hello~各位亲爱的看官老爷们大家好.估计大家都听过,尽量将CSS放头部,JS放底部,这样可以提高页面的性能.然而,为什么呢?大家有考虑过么?很长一段时间,我都是知其然而不知其所以然,强行背下来应付 ...
随机推荐
- Android 开发之拦截EditText的输入内容,定制输入内容
1.EditText作为一个比较成熟的View,在Android的应用开发中得到极为广泛的使用.在某些特殊情况下,我们可能需要定制EditText的输入内容, 只允许指定功能的输入,例如输入一个”dd ...
- img标签中alt和title属性的正确使用
在的img标签有两个属性分别为alt和title,对于很多初学者而言对这两个属性的正确使用都还抱有迷惑,当然这其中一部分原因也是ie浏览器所导致的.正确的使用这两个属性除了可以提高图片的搜索能力外,在 ...
- python数据结构与算法——冒泡排序
用两种方式实现,非递归和递归 直接上代码: 先是失败的递归方式,涉及到对象引用的问题: # Bad 想一想为啥不行? def bubblesort_rec_bad(A): if len(A)==1: ...
- OC 属性
1 属性和实例变量 :属性 == 实例变量声明 + setter 方法+ getter 方法 在老版本的 OC 语言中,我们需要同时声明属性和底层实例变量,那时,属性是 OC 语言的一个新的机制,并 ...
- CE5 WiFi开关
WinCE的WiFi开关要依赖于WiFi模块的休眠功能还有模块厂商提供的驱动里面有支持电源管理功能.这里面用的是SDIO86861模块,WinCE5的系统,S3C2416的CPU. 头文件要包括:#i ...
- Waves:类Material Design 的圆形波浪(涟漪)点击特效插件
Waves:类Material Design 的圆形波浪(涟漪)点击特效插件 2014/08/06 分类:前端开发, 素材分享 浏览:6,734次 来源:原创 1个评论 6,734 ...
- 037. asp.netWeb用户控件之五使用用户控件实现文件上传功能
fileUpload.ascx代码: <%@ Control Language="C#" AutoEventWireup="true" CodeFile= ...
- NET-SNMP配置
配置/etc/snmp/snmpd.conf such as below : ============================================== com2sec notCon ...
- next().value和next().done
function* sayHello() { var first, second; yield first = '111'; yield second = '222'; yield third = ' ...
- Angular1.x组件通讯方式总结
Angular1开发模式 这里需要将Angular1分为Angular1.5之前和Angular1.5两个不同的阶段来讲,两者虽然同属Angular1,但是在开发模式上还是有较大区别的.在Angula ...