关于VUE项目启动后，首次加载时间问题

　　因为在项目中用到了三方的图标库iconify，我采用的是vue2(offline)的模式使用的。发现用了之后项目启动后，首次访问加载时间非常长，达到了将近20秒之久。

 　　这是在未使用iconify的时候程序首次加载时耗时细节，其中webpack打包和分割项目代码文件耗时非常之短，项目页面背景图片等资源加载也很快，都是毫秒级别。

　　但是但我在vue组件中我安装了这些依赖包，并且使用import引入iconify库时，响应时长直线上升（此时并没有在项目中使用iconify图标，仅仅是引入而已），我引入了如下库：

　　import { Icon } from '@iconify/vue2';
　　import cargoCrane from '@iconify/icons-game-icons/cargo-crane';
　　import carCrane from '@iconify/icons-tabler/car-crane';
　　import paperCrane from '@iconify/icons-game-icons/paper-crane';
　　import colaIcon from '@iconify/icons-icon-park-outline/cola';
　　import teaOutline from '@iconify/icons-mdi/tea-outline';

 　　响应时间如上所示，webpack打包和分割项目代码文件耗时达到4秒，项目页面背景图片等资源加载时间也需要5秒之久。而且这还是我只在vue组件中import了，并没有使用npm install安装这些依赖包。

　　后面在vue组件中使用这些图标，首次耗时情况如下图所示：整体耗时也是非常的长。

　　得出结论：最好不要采用iconify官网给出的vue2(offline)方式来引用图标，可以直接使用SVG的方式来进行引入，不然这个首次加载时间太长是个很大的问题。即使在后续访问网页时因为有缓存的原因，界面加载也很快，但是首次访问确实体验很差。

目前暂不清楚为什么引入这些依赖会导致Webpack 构建过程变慢（不仅构建过程的时间从毫秒级变成秒级，包括后续对程序中本地图片加载同样从毫秒级变成秒级）。