新浦京娱乐场官网-301net-新浦京娱乐www.301net
做最好的网站

本文作者

Angular 和 Vue 按需加载的连串实行优化方案

2016/07/12 · JavaScript · 前端框架

正文小编: 伯乐在线 - 新空气 。未经小编许可,禁止转载!
应接参与伯乐在线 专辑小编。

本着后边多少个优化的点有不菲,比方:图片压缩,雪碧图,js/css/html 文件的减弱合并,  cdn缓存, 缩小重定向, 按需加载 等等

近期有考虑针对 ionic项目 和 vue项目,做一个相当的大的优化,做成按需加载(也等于无供给不加载),此刻本人心头是十二万分激动的。

推荐看的按需加载的作品:

angular 按需加载 相关文章:

1:  

2:  

vue 按需加载  相关随笔:

1: http://cn.vuejs.org/guide/components.html#异步组件

2: 

-----------------------------------------------------------

明天就照准,按需加载(也正是无央求不加载),分别交付一些实际项目经历的方案:

angular 按需加载方案:$ocLazyLoad

vue 按需加载方案:require([异步加载的零器件], resolve)

 

 angular按需加载:$ocLazyLoad

亟待3个步骤,就能够完毕按需加载的方案。

第1步:bower install oclazyload

第2步:$ocLazyLoad封装:

图片 1

第3步:ui-router 路由安插:

图片 2

此方案完结了,template 和 controller 的文书按需加载。这时候去拜谒页面就能够见到效果了。

 

效果Gif演示:

图片 3

 

vue 按需加载方案:require([异步加载的构件], resolve)

内需2个步骤,就足以成功按需加载

首先步,针对webpack.js 做布置的转移,如图:

图片 4

 

其次步:针对 router 路由,实行改换,主假若component的退换,如图。

图片 5

其三步:实施 npm run build 打包命令,就足以见到chunks文件夹生成了过多chunk的小文件,正是vue组件页面,如图:

图片 6

1 赞 1 收藏 评论

有关作者:新空气

图片 7

简单介绍还未来得及写 :) 个人主页 · 小编的篇章 · 3

图片 8

本文由新浦京娱乐场官网-301net-新浦京娱乐www.301net发布于www.301net,转载请注明出处:本文作者

您可能还会对下面的文章感兴趣: