css文件和js文件应当放在页面哪里

前提：问的是性能优化 ?

css文件放在页面的头部
why?

<link rel="stylesheet" href="home.css">

link标签里面的href（HyperText reference）属性表示超文本引用，当CSS使用href引用，浏览器会识别该文档为CSS，并行下载，不会停止对当前文档的加载，在加载html生成DOM tree的时候，就可以同时对DOM tree进行渲染，这样可以防止闪跳，白屏或者布局混乱

js文件放在body的闭合标签之前
why？

<script src="home.js"></script>

src(source)资源，是页面必不可少的一部分，当script使用src引用，浏览器解析到该元素时会停止对文档的渲染，直到该资源加载完成。这也是将script放底部而不是头部的原因。加载js文件会停止对dom的创建，而且js加载完会立即执行，同时会阻塞后面资源的加载

追问：我现在就是要把js文件放在头部，怎么处理？
当浏览器解析到script标签时，默认会先先下载js文件下载完了就执行，脚本的执行时同步和阻塞的，为了解决阻塞的问题，script标签新增了两个布尔属性，分别是defer（延迟）和async(异步)

<script src="home.js" defer></script>
<script src="home.js" async></script>

当使用defer时，js和html并行下载，不会阻塞dom树的创建，当dom树创建完成时才会执行js
当使用async时，js和html并行下载，当下载完会立即执行js，执行期间会阻塞html的解析