zoukankan      html  css  js  c++  java
  • js延迟加载

    js延迟加载只有一个目的:让页面先展现出来

    js的过多代码会造成页面出现白色,阻塞页面内容,对于用户来说js是看不到的他们只是想快点先看到页面。

    方法1:defer , 这属性可以让DOM加载好了再执行js外部文件,只用于引入的script标签中 <script src="demo.js" defer></script>, 多个defer之间,按顺序执行,值得一提的是,即使加了defer,并不能改变是在onload事件之前就运行的事实(defer 比 async 先执行)

    方法2:async, 这属性异步加载js,只用于引入的script标签中 <script src="demo.js" async></script>在浏览器开了一个线程在浏览器开了一个线程在浏览器开了一个线程,js是单线程浏览器不是,所以在浏览器再渲染线程的同时,也开启js引擎线程,即使加了async,并不能改变是在onload事件之前就运行的事实,与defer不同的是,这异步是和渲染同时进行,并且多个async顺序情况不确定,不考虑依赖,所以用还是defer更好

    方法3:动态添加引入script标签,可以看出把引入操作放在了onload事件后

    <script type="text/javascript">  
       function downloadJSAtOnload() {  
           varelement = document.createElement("script");  
          element.src = "defer.js";  
          document.body.appendChild(element);  
       }  
       if (window.addEventListener)  
          window.addEventListener("load",downloadJSAtOnload, false);  
       else if (window.attachEvent)  
          window.attachEvent("onload",downloadJSAtOnload);  
       else window.onload =downloadJSAtOnload;  
    </script>

    方法4:script写在</body>里面紧挨着,很实用

    方法5:setTimeout将js代码延迟执行

  • 相关阅读:
    挖矿病毒 netstat与ss重要区别
    leetcode 正则表达式匹配
    DNS重新绑定攻击
    Mac OS ssh 禁用密码登陆
    linux alias 别名在Bash脚本内不起作用 远程执行alias 命令不工作
    centos 7 搭建 l2tp
    psacct 软件包工具监视所有用户执行的命令
    随机密码生成
    Linux 进程 cpu 使用排序 内存 使用排序
    nginx 反向代理 uri 重写
  • 原文地址:https://www.cnblogs.com/wchjdnh/p/10801309.html
Copyright © 2011-2022 走看看