项目中所做的优化

1. vue实现较多，放弃使用zepto。

2. swiper.js在进入详情页的时候再开始加载。

3. flexible.js、reset.css 是否要内联，因为用户可能会经常登录，如果使用内联的方式那么就不会被缓存了， 所以如果放在文件中引入，可以缓存。

4. 对于接受的数据，汉字不是UTF-8，所以这边显示是乱码，浏览器就需要话费时间去解析这个乱码，所以经过后端的调试，请求得到的就是正确的汉字，这样前端浏览器就不会解析乱码了。

优化加载方式

　　使用activated、keep-alive、 beforeRouterEnter实现页面加载的完美化！

beforeRouteEnter (to, from, next) {
next();
if (from.path == '/microComBuilding') {
sessionStorage.setItem('create', 'true');
} else {
sessionStorage.setItem('create', 'false');
}

if (from.path == '/') {
sessionStorage.setItem('reload', 'true');
} else {
sessionStorage.setItem('reload', 'false');
}
},

activated () {
if (sessionStorage.getItem('create') == 'true') {
if (sessionStorage.getItem('reload') == 'false') {
this.getClassify();
this.RESET_VALUE();
}
} else {
// 什么都不做
}
},

　　思路很简单，就是将commodity页面设置为静态的。 但是从微商厦进入时数据就得不到刷新了。 如果希望刷新，就必须要设置为动态的，但是动态的页面在切换的时候所带来的消耗有时巨大的。所以，我们可以通过路由来判断。但是上面的代码还是有问题。

　　但是在activated 中的问题就是如果是第一次进来呢，那么created和activated 就会同时发送两个数据， 这样的情况是我们不想看到的，所以我们可以根据store中的state再添加一次判断，就是如果第一次进来，那么activated 钩子函数和created的钩子函数相差的间隔只有20ms，所以这个获取店铺信息的数据是不可能请求的回来的，从network中可以看到这个请求的时间约是间隔时间的10倍以上，我们可以认为远远大于，所以下面的代码是没有问题的。

activated () {
console.log('activeated' ,new Date().getTime());
// 从微商厦页面进入时一定是要从新加载数据的。
if (sessionStorage.getItem('create') == 'true') {
// 如果此时用户刷新了页面，那么create的时候获取数据就可以了，所以不刷新的时候从微商厦进入再获取数据
if (this.$store.state.items.length !== 0) {
if (sessionStorage.getItem('reload') == 'false') {
// 但是还是有一个问题，就是第一次进入的时候， 并没有刷新，那么还需要一个flag
// 在created之后就会触发activated 钩子函数，这段时间发送的请求是不可能回来的，间隔只有20ms。
this.getClassify();
this.RESET_VALUE();
}
}
} else {
// 什么都不做
}
},