Chaoszhu'Blog

Appearance

script标签的type=module ​

兼容情况：https://www.caniuse.com/#search=module

在浏览器中使用模块化type="module" ​

html
<html>
  <body>
    <script type="module">
      import Vue from 'https://unpkg.com/vue@2.6.0/dist/vue.esm.browser.min.js'
      let vm = new Vue({
        name: '123'
      })
      console.log(vm) // vue实例

      // 再次导入
      import Vue2 from 'https://unpkg.com/vue@2.6.0/dist/vue.esm.browser.min.js'
      console.log(Vue2) // vue构造函数
    </script>
  </body>
</html>
js
// test.js
export let a = 666

注意：script标签不能加src，否则script中间写的代码无效

资源加载优先级 priority ​

image

chrome开始解析网页，并开始下载图片、Script 以及 CSS 等资源的时候，浏览器会为每个资源分配一个代表资源下载优先级的 fetch priority 标志

Document、Script、CSS、Font、Image 等不同的资源类型会有不同的优先级. 在 viewport 中的优先级可能会更高

importance 属性

importance 属性可以指定三个值：high(高)、low(低)、auto(默认优先级)

  • 控制资源加载的优先级，包括 link、img、script、iframe 等标签

  • chrome试验阶段属性

html
<!-- eg -->
<link href="/js/script.js" importance="low">