博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
性能优化
阅读量:4977 次
发布时间:2019-06-12

本文共 663 字,大约阅读时间需要 2 分钟。

1、单页面开发首次加载白屏

  vue中使用路由懒加载。懒加载也叫延迟加载,按需加载。

  像vue这种单页面应用,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,时间过长,会出啊先长时间的白屏,即使做了loading也是不利于用户体            验,而运用懒加载则可以将页面进行划分,需要的时候加载页面,可以有效的分担首页所承担的加载压力,减少首页加载用时

    简单的说就是:进入首页不用一次加载过多资源造成用时过长

  代码:vue自带的require

es提出的import(推荐):

2、商品列表图片过多,加载慢。

  使用vue图片懒加载。   当加载的这个图片的时候才会加载,不会提前全部加载

  1、安装vue-lazyload插件

  

npm install vue-lazyload --save-dev

  2、main.js引入并使用

  

  3、 vue文件中将需要懒加载的图片绑定 v-bind:src 修改为 v-lazy

3、将后端返回大批量数据时,在sessionStorage中存储一份

  向电商网站的二级导航部分,请求的数据较多。如果每刷新一次数据,就重新向后端请求一次数据,就会比较耗费 性能。

4.shouldComponentupdata生命周期函数

  纯函数,  UI无状态组件 ,

  immutable持久化数据结构 

转载于:https://www.cnblogs.com/xixinhua/p/10544024.html

你可能感兴趣的文章
toad for oracle中文显示乱码
查看>>
SQL中Group By的使用
查看>>
两个表格中数据不用是一一对应关系--来筛选不同数据,或者相同数据
查看>>
js05-DOM对象二
查看>>
mariadb BINLOG_FORMAT = STATEMENT 异常
查看>>
C#生成随机数
查看>>
Java回顾之多线程
查看>>
机电行业如何进行信息化建设
查看>>
2018 Multi-University Training Contest 10 - Count
查看>>
HDU6203 ping ping ping
查看>>
Fireworks基本使用
查看>>
Java基础常见英语词汇
查看>>
nginx启动、关闭命令、重启nginx报错open() "/var/run/nginx/nginx.pid" failed
查看>>
BZOJ 3097 Hash Killer I
查看>>
UINavigationController的视图层理关系
查看>>
html阴影效果怎么做,css 内阴影怎么做
查看>>
BZOJ1026: [SCOI2009]windy数
查看>>
样板操作数
查看>>
组件:slot插槽
查看>>
Nginx配置文件nginx.conf中文详解(转)
查看>>