前端优化使用@import 判断

主要的问题在于@import的加载机制：

通过@import引用的文件，是在页面内容载入完毕后再加载

常现问题：

1.影响浏览器的并行下载

2.多个@import导致下载顺序紊乱

可见https://segmentfault.com/q/1010000007126226

3.会因为加载文件的机制，读取完文件后在加载，网速慢的时候导致样式出现闪烁

4.每一个@import都会产生一个新的http请求，过多文件会增加http的请求数

二、对于引用css文件或是利用scss文件会有不同的判断

1.对于直接引用css文件：

尽量避免使用-@import影响页面性能的地方主要体现在两个方面

影响浏览器的并行下载

多个@import导致下载顺序紊乱

会因为加载文件的机制，读取完文件后在加载，导致样式出现闪烁

2.对于利用scss文件：

项目工程不大，CSS内容不是很多, 可以利用scss转义成一个css文件

SCSS的机制是会把对应的文件转译成css文件

当多个scss文件，利用一个main.scss @import之后，会通过机制先编译成一个css，后引入到html文件，从而可以避免上面的问题