Vue 上线优化方案
#1 为什么要引入外部CDN
最近博客上线,但是在首次加载的时候,需要消耗很多时间,大概在50秒左右,就是说第一页登录页面,就需要用户等待50秒(服务器是最低配置也是一个原因),看了一下...最终,结合网上的前辈们的解答,首屏加载时间过长重要有以下几点:
图片,登录页面(打开网站的第一个页面)静态图片过多也会在首屏中加载出来,消耗时间
Vue代码里面Router没有使用懒加载
使用npm安装第三方库...主要的处理方式就是减小图片的大小
我这里直接把登录页面的背景图片全部去掉,这样子直接可以省很多时间
#2.2 Router懒加载
webpack默认将所有js源代码打包成一个js文件,导致JS包会变得非常大,影响页面首次加载速度...我的项目这几个库需要外部引入CDN
vue
vuex
axios
vue-router
view-design
element-ui
echarts
countup
引入外部CDN大致需要三部:
配置文件...import Vue from 'vue'
// import Vuex from 'vuex' // 使用CDN后注释掉
// Vue.use(Vuex); // 使用CDN后注释掉
axios/index.js