解决单页面加载图片过多单个图片过大加载慢的问题

包臀牛仔裤 2013-12-11 11:32:06

rt，在网上搜了一下说lazyload延迟加载，试了效果不错。图片只在浏览器可视大小区域自动加载新图片。但是浏览区域如果加载一张满屏图片，还是很慢，我的意思是单个图片本身宽高和size就很大，有好的解决办法吗

比如红色区域加载一张大图，会很慢

...全文

1755 2 打赏收藏转发到动态举报

写回复

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

tony4geek 2013-12-11

打赏
举报

回复

好像和图片格式什么的，你找找类似的网站。同一张图片。格式，像素都回影响的

斯洛文尼亚旅游 2013-12-11

打赏
举报

回复

这个和网速，服务区带宽，图片大小有关

此为示例代码，详细详解请参考： http://blog.csdn.net/guolin_blog/article/details/12646775 如对资源内容有疑问，请到博客主留言。

css sprite 雪碧图生成小程序,已在github上开源，地址：https://github.com/iwangx/sprite

页面加载过多图片导致卡顿——解决方案详解

看看这些人的想法能不能帮上你：甲： 1，不太“在乎”用户体验的省事方法：图片保存成渐进式的，加载会慢慢变清晰，而不是从上往下依次加载，然后放在 CDN，设置缓存之类。 2，比较“在乎”用户体验的高端方案：判断用户的设备（主要用在移动端）、网络等，分别加载不同质量的图片（例如高端 iPhone wifi 情况下，就可以加载双倍高清图等，蜂窝网络下面，就加载个单倍或者有

在一次活动中后端返回的图片和信息过于多，在没有配置懒加载时上线以后导致页面加载白屏点击无反应等问题，经过查询发现vue插件 vue-lazyload 是一个用来实现图片懒加载的好插件，于是实验开始 1，安装插件 npm install vue-lazyload --save-dev 2，在main.js中引入（也可以单页面引入） import VueLazyLoad from 'vue-lazyload'; // 导入懒加载 Vue.use(VueLazyLoad,{ error:'../static/i

87,991

社区成员

224,684

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章