浏览器加载外部js 的顺序,以及处理顺序。

时间:2022-10-28 09:04:24

问题, 有事候按F12打开 google的调试台后,查看network下面加载过来的资源是, 有些资源的状态处于 pending..

个人理解: 浏览器是可以同时开启多个http 请求去加载外部的资源的, 我们讨论浏览器同时加载 2 个外部的javascript 文件的情况。

当浏览器同时开启两个线程去加载外部的两个 js 文件时 ,都加载完成之后, 肯定是有先后顺序的, 这时加载完成的 js 文件要给 浏览器内

的 javascript 解释器执行, 我们知道,js 解释器是单线程的,所以虽然两个文件都加载完成了, 当先加载完成的那个 js 文件还在被 js 解释器

执行的时候, 另外一个 js 文件虽然基本上已经 加载完成了(这个有时间抓包,看看文件是不是有通过http响应已经拿回到浏览器了!验证一下) ,

但还是处于 pending 状态, 当前面那个 先加载处理完成的 js 文件被 js 解释器执行完成的时候, 这个 js 文件的状态立即 变成 “http 200 ok”状态!!

个人理解!

浏览器加载外部js 的顺序,以及处理顺序。的更多相关文章

  1. 无阻塞加载外部js(动态脚本元素,XMLHttpRequest注入,LazyLoad)

    动态脚本元素即在js中去创建<script>标签加载外部js并执行,这样加载的好处是文件的下载和执行过程不会阻塞页面的其他进程.通过下面两个例子对比出效果 <!DOCTYPE htm ...

  2. Vue 加载外部js文件

    Vue.js  加载外部js文件 在项目内新建一个config.js //变量的定义 export var config = { baseurl:'http://172.16.114.5:8088/M ...

  3. 使用js加载器动态加载外部js、css文件

    let MiniSite = new Object(); /** * 判断浏览器 */ MiniSite.Browser = { ie: /msie/.test(window.navigator.us ...

  4. jQuery Mobile页面跳转后未加载外部JS&lpar;转&rpar;

    http://thewaychung.iteye.com/blog/1807447 在使用jQuery Mobile进行Web开发中,当页面跳转时(pageA => pageB),在pageB中 ...

  5. kettle转换JavaScript加载外部js文件

    日常开发中,时常会出现这样一种情况.有大量的函数是通用的.而每个JavaScript里面写一遍,给维护带来很大的困扰.因而需要将公共的函数写在外部js文件中.这时就需要引入外部的公共文件了.下面是在转 ...

  6. jQuery Mobile页面跳转后未加载外部JS原因分析及解决

    在使用jQuery Mobile进行Web开发中,当页面跳转时(pageA => pageB),在pageB中引用的JS并未成功运行.因为,JQM并为将整个页面加载到当前的dom中,仅将data ...

  7. 浏览器加载显示html页面内容的顺序

    我们经常看到浏览器在加载某个页面时,部分内容先显示出来,又有些内容后显示.那么浏览器加载显示html究竟是按什么顺序进行的呢 其实浏览器加载显示html的顺序是按下面的顺序进行的:1.IE下载的顺序是 ...

  8. 浏览器加载和渲染html的顺序(html&sol;css&sol;js)

    最近在学习前端的技术,把html.js.css的基础知识看了看.感觉越看越觉得前端并不比后端容易,技术含量还是相当大的.今天突然想弄明白浏览器到底是怎么加载和渲染html的?html中的DOM.js文 ...

  9. 浏览器加载和渲染html的顺序

    前阵子,在组内给大家做了一次关于“浏览器加载和渲染HTML的顺序”的分享,这里再总结一下吧. AD:干货来了,不要等!WOT2015 北京站演讲PPT开放下载! 1.浏览器加载和渲染html的顺序 浏 ...

随机推荐

  1. 作为前端er,写在年末的一些话

    写惯了技术类的文章,这种总结和唠嗑型的我基本也就在年末才来一篇.说实话,这种轻松类的文章往往比技术类的要受欢迎的多,因为其受众更广,看起来也不烧脑. 说来愧疚,这一年其实产出有点低,大致就写了不到二十 ...

  2. java比较版本号

    java比较版本号,比如1.0.3和1.2.1相比较考虑到可以用String的compareTo()方法,代码如下: public class MainClass { public static vo ...

  3. OpenGL投影矩阵

    概述 透视投影 正交投影 概述 计算机显示器是一个2D平面.OpenGL渲染的3D场景必须以2D图像方式投影到计算机屏幕上.GL_PROJECTION矩阵用于该投影变换.首先,它将所有定点数据从观察坐 ...

  4. 转数据库Sharding的基本思想和切分策略

    本文着重介绍sharding的基本思想和理论上的切分策略,关于更加细致的实施策略和参考事例请参考我的另一篇博文:数据库分库分表(sharding)系列(一) 拆分实施策略和示例演示 一.基本思想 Sh ...

  5. sizeof&lpar;&rpar;与strlen&lpar;&rpar;的区别

    首先需要说明的是sizeof和strlen都可以求长度,但是却有很大的区别,简单来说可以概括为以下几点: 1.sizeof是一个关键字,而strlen确实一个函数. 2.sizeof求的是字节长度,而 ...

  6. java synchronized&lpar;一&rpar;

    java synchronized主要用于控制线程同步,中间有很多小的细节,知识,这里我简单的整理一下,做个记录.主要用于方法和代码块的控制 先说说方法控制 模拟银行存款和取款,创建一个Account ...

  7. IPC进程间通信 - AIDL&plus;Binder

      原理 http://www.linuxidc.com/Linux/2012-07/66195.htm   服务端,客户端处在用户空间,而binder驱动处在内核空间. 服务器端.一个Binder服 ...

  8. Python之路第六天,基础&lpar;7&rpar;-正则表达式&lpar;re&rpar;

    Python RE模块(正则表达式) 就其本质而言,正则表达式(或 RE)是一种小型的.高度专业化的编程语言,(在Python中)它内嵌在Python中,并通过 re 模块实现.正则表达式模式被编译成 ...

  9. 转&colon; window中使用PSFTP&sol;WinSCP实现SFTP上传下载

    sftp 服务器:  dbmonitor 1.sftp属于交互式的,所以你得缓存下命令#!/bin/shsftp -o Port=3322 root@172.16.1.21:/opt << ...

  10. Mego开发文档 - 加载关系数据

    加载关系数据 Mego允许您使用模型中的导航属性来加载相关数据对象.目前只支持强制加载数据对象.只有正确配置了关系才能加载关系数据,相关内容可参考关系配置文档. 加载对象属性 您可以使用该Includ ...