VUE 首次打开页面加载资源过大的解决办法

作为一个Java开发者,真的是要做一个百变金刚。(日常吐槽,请略过…….)

        公司没有专职的前端开发,老板需要做一个vue的App,作为自命不凡的未来的软件架构师的我,接下了这个毫无头绪的摸不着东南西北的小项目。所有的东西开发完成,上线部署,发现第一次访问都会很慢,之后就变快了。F12 打开,查看请求,发现app.js这个文件竟然有13.1M(如下图),这么大的一个文件,要在第一次访问的时候加载进来,实在是考验用户的忠实程度,凡是没有120分耐心的人,都会在2秒内关闭,更何况有的人 速慢要等个10秒呢!

 

      既然出现了问题,就要想办法解决,于是上 找各种资料,了解到,出现第一次加载会请求过大的文件的原因在于没有采用懒加载的方式,所有的资源文件都会在第一次访问的时候请求过来,so,决定采用路由懒加载的方式,进行改装。以下是原本路由的配置方式:

使用路由懒加载的方式配置如下:

配置过懒加载方式后,再次看请求的结果:

哇,真的是天壤之别,一下子从13.4M缩小到了883k,打开的速度一下子提升了十几倍。

(术业有专攻呐,如果是一个专业的前端开发人员,他应该直接就能想到结果吧。。。)

文章知识点与官方知识档案匹配,可进一步学习相关知识Vue入门技能树首页概览23389 人正在系统学习中

声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2018年10月15日
下一篇 2018年10月15日

相关推荐