<img />,<style>这些资源是并行请求与加载。

<script>脚本是同步请求与加载,阻塞加载。加载完成并执行后再继续解析HTML。

动态<script>是异步加载,就是说可以同时加载其他资源。

关于<script>的执行,分为立即执行和延迟执行。

对于浏览器来说,不管是<style>, <img />, <script>都是一视同仁,都是并行请求多个资源文件并加载,而不是一次只请求一个资源并加载。

只不过最大连接数有限制, 为6个或2个,并行加载6个资源。

但是遇到<script>会有特殊,即阻塞加载其他资源,比如<img/>等。

<script>加载与执行两个阶段,加载是阻塞其他资源的加载,执行也会阻塞。

执行是肯定会阻塞,这个没有什么异步执行,只有延迟执行和立即执行。

加载是并行加载,但是<script>特殊,故分为同步和异步加载。


HTML解析过程中,遇到<style>, <img/>, <script>会去并行加载外部资源。

同步加载(阻塞模式)但是遇到<script>时,会阻止浏览器的后续处理,停止后续的HTLM的解析,因此阻塞后续页面的处理,比如<img/>, <script>, <style>等资源的加载,以及HTML的渲染,和代码的执行。

异步加载(非阻塞),下载js的同时,还会继续进行后续页面的处理

js 之所以要同步执行,是因为 js 中可能有输出 document 内容、修改dom、重定向等行为,所以默认同步执行才是安全的。

<script>的阻塞不仅仅是资源文件的加载,而是HTML的解析和渲染,导致了不能加载包含的资源文件。

执行JS必然会阻塞其他一切资源的加载,但是异步加载不会阻塞资源的加载。

但是加载完之后是立即执行还是延迟执行这个可以通过defer来指定。

async异步加载,立即执行。

defer异步加载,延迟执行。

浏览器解析HTML文档的资源并下载的更多相关文章

  1. apache不解析php文档?提示需要下载(转)

    在httpd.cong中 LoadModule php5_module modules/libphp5.so #这一行php5安装的时候就已经自动添加上了 AddType application/x- ...

  2. 使用JDOM解析xml文档

    一.使用JDOOM解析xml文档 准备工作 1.下载JDOM.jar 包 解析代码如下 import org.jdom2.Attribute; import org.jdom2.Document; i ...

  3. 四种生成和解析XML文档的方法详解(介绍+优缺点比较+示例)

    众所周知,现在解析XML的方法越来越多,但主流的方法也就四种,即:DOM.SAX.JDOM和DOM4J 下面首先给出这四种方法的jar包下载地址 DOM:在现在的Java JDK里都自带了,在xml- ...

  4. java 解析XML文档

    Java 解析XML文档 一.解析XML文档方式: 1.DOM方式:将整个XML文档读取到内存中,按照XML文件的树状结构图进行解析. 2.SAX方式:基于事件的解析,只需要加载XML中的部分数据,优 ...

  5. 四种生成和解析XML文档的方法详解

    众所周知,现在解析XML的方法越来越多,但主流的方法也就四种,即:DOM.SAX.JDOM和DOM4J 下面首先给出这四种方法的jar包下载地址 DOM:在现在的Java JDK里都自带了,在xml- ...

  6. 源生API解析XML文档与dom4j解析XML文档

    一.XML语言 XML是一种可扩展的标记语言,是一种强类型的语言,类似HTML(超文本标记语言,是一种弱类型的语言).XML是一种通用的数据交换格式(关系型数据库),综上所诉:XML可以传输数据,也可 ...

  7. 大杂烩 -- 四种生成和解析XML文档的方法详解

    基础大杂烩 -- 目录 众所周知,现在解析XML的方法越来越多,但主流的方法也就四种,即:DOM.SAX.JDOM和DOM4J DOM:在现在的Java JDK里都自带了,在xml-apis.jar包 ...

  8. 四种生成和解析XML文档的方法介绍

    解析XML的方法越来越多,但主流的方法也就四种,即:DOM.SAX.JDOM和DOM4J 1.DOM(Document Object Model) DOM是用与平台和语言无关的方式表示XML文档的官方 ...

  9. <JavaScript>“浏览器模式”和“文档模式”之间的区别

    只有IE浏览器中才会有“浏览器模式”和“文档模式”,兼容性视图涉及两个重要的功能便是“浏览器模式[browser mode]”和“文档模式[document mode]”,在IE8/IE9中按F12键 ...

随机推荐

  1. 第六章Linux的文件权限与目录配置

    一.Linux用户分类 1.Linux用户分为:(文件|目录)所有者(OWN),(同组内的)用户组,其他人; 2.一个天神:root;,几乎能完成任何事.... 二.目录权限的意义 目录的权限和文件的 ...

  2. Oracle 查看相关优化器参数

    select x.ksppinm name, y.ksppstvl value, y.ksppstdf isdefault, decode(bitand(y.ksppstvf, 7), 1, 'MOD ...

  3. Linux获取用户主目录

    #!/usr/bin/python# -*- coding:utf-8 -*-import sysimport osclass get_home_path(object): def __init__( ...

  4. Python脚本控制的WebDriver 常用操作 <九> 定位一组对象

    下面将使用WebDriver来模拟操作定位一组对象的操作 测试用例场景 从上一节的例子中可以看出,webdriver可以很方便的使用find_element方法来定位某个特定的对象,不过有时候我们却需 ...

  5. ref和out的区别

    ref类型参数是按地址传递,能改变原来的数值.使用ref传参前,变量必须赋值. 带有ref类型参数的函数,不会清空变量,所以离开该函数的时候,所有ref引用的变量可以赋值也可以不赋值. out类型参数 ...

  6. Android中使用WebView, WebChromeClient和WebViewClient加载网页

    在android应用中,有时要加载一个网页,如果能配上一个进度条就更好了,而android 中提供了其很好的支持, 其中webView的一系列用法,比如 webView.getSettings().s ...

  7. mvc中使用knockoutjs和ajax

    虽然说knockoutjs 官网上写的非常的清楚!但是像我这样的英语呕吐患者,真是虐心啊!今天我写下做个记录,也为那些初次使用的同学给予帮助, 首先我说一下今天我说的内容只是应用不做原理探究,如果没有 ...

  8. (转)android Fragments详解一:概述

    Fragment是activity的界面中的一部分或一种行为.你可以把多个Fragment们组合到一个activity中来创建一个多面界面并且你可以在多个activity中重用一个Fragment.你 ...

  9. 二、secureCRT的 使用过程

    准备工作: win7与linux能互相ping通 linux安装了ssh被登陆服务 关闭window 防火墙,,控制面板 下载secureCRT 参考资料:http://zhidao.baidu.co ...

  10. 出色的 JavaScript API 设计秘诀

    设计是一个很普遍的概念,一般是可以理解为为即将做的某件事先形成一个计划或框架. (牛津英语词典)中,设计是一种将艺术,体系,硬件或者更多的东西编织到一块的主线.软件设计,特别是作为软件设计的次类的AP ...