AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载

时间：2021-10-24 20:47:59

AngularJS项目开发技巧之图片预加载

绪

项目(移动端采用Ionic 框架)开发完毕，测试阶段发现移动APP首页的广告图片(图片由服务器端返回相应url地址)很难加载，主要原因还是网速。如下图左所示，图片加载完毕如下图右所示。

AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载           AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载

问题分析

尝试进行图片加载的优化工作。

经过与Ionic群内卖火柴朋友的聊天，获取到如下内容:手机端访问速度受服务端带宽的限制。一个接收一个传输，和两方都有关系。服务器对app影响是很大的。2M 一般是网站使用还可以  app会不乐观。增加服务器带宽比在客户端做工作要好很多，还有就是服务图片优化。缓存机制只是下载后的事情，再说ionic的拉数据加上缓存有bug。只能是轮番 和一些固定图片可以使用。因此考虑使用缓存机制的策略暂时告吹。

问题解决

提升服务端带宽。2M-->?M

在这里只是提供一个解决问题的思路，若大家有什么好的建议或想法可以给我留下你宝贵的评论，谢谢。

美文美图

AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载

AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载的更多相关文章

  1. AngularJS进阶(三十六)AngularJS项目开发技巧之利用Service&Promise&Resolve解决图片预加载问题(后记)

    AngularJS项目开发技巧之利用Service&Promise&Resolve解决图片预加载问题(后记) 前言 在"AngularJS项目开发技巧之图片预加载" ...

  2. AngularJS进阶(三十一)AngularJS项目开发技巧之获取模态对话框中的组件ID

    AngularJS项目开发技巧之获取模态对话框中的组件ID 需求 出于项目开发需求,需要实现的业务逻辑是:药店端点击查看"已发货""已收货"订单详情时,模块弹出 ...

  3. 【原创】从零开始搭建Electron+Vue+Webpack项目框架（五）预加载和Electron自动更新

    导航: (一)Electron跑起来(二)从零搭建Vue全家桶+webpack项目框架(三)Electron+Vue+Webpack,联合调试整个项目(四)Electron配置润色(五)预加载及自动更 ...

  4. HBuilder mui 手机app开发 Android手机app开发 ios手机app开发 打开新页面 预加载页面 关闭页面

    创建子页面 在mobile app开发过程中,经常遇到卡头卡尾的页面,此时若使用局部滚动,在android手机上会出现滚动不流畅的问题: mui的解决思路是:将需要滚动的区域通过单独的webview实 ...

  5. AngularJS进阶(三十九)基于项目实战解析ng启动加载过程

    基于项目实战解析ng启动加载过程 前言 在AngularJS项目开发过程中,自己将遇到的问题进行了整理.回过头来总结一下angular的启动过程. 下面以实际项目为例进行简要讲解. 1.载入ng库 2 ...

  6. AngularJS进阶(三十八)上拉加载问题解决方法

    AngularJS上拉加载问题解决方法 项目中始终存在一个问题:当在搜索栏输入关键词后(见图1),按照既定的业务逻辑应该是服务端接收到请求后,首先返回查询的前7条数据,待客户端出现上拉加载时,继续查找 ...

  7. Andriod开发技巧——Fragment的懒加载

    我们在做应用开发的时候,一个Activity里面可能会以viewpager(或其他容器)与多个Fragment来组合使用,而如果每个 fragment都需要去加载数据,或从本地加载,或从网络加载,那么 ...

  8. AngularJS进阶(三十五)浏览器兼容性解决之道

    浏览器兼容性解决之道 前言 浏览器兼容性一直是前端开发中不得不面对的一个问题.而最突出的就是IE.对绝大多数公司来说,兼容IE6的性价比已经很低,而IE7则几乎已经绝迹.所以,常见的兼容性下限是IE8 ...

  9. AngularJS进阶(三十四)Angular数据更新不及时问题探讨

    Angular数据更新不及时问题探讨 前言 在修复控制角标正确变化过程中,发觉前端代码组织层次出现了严重问题.传递和共享数据时自己使用的是rootScope,为此造成了全局变量空间的污染.根据< ...

随机推荐

  1. 转WCF Proxy Authentication Required

    WCF Proxy Authentication Required The Problem When I’m in the office, I have to use an authenticated ...

  2. Aspen 安装

    按原安装后破解不成功后: 从下载文件夹中,找到 AspenONEV8.\Patch\-STRGXI2.zip,里面有个 STRGXI2.dll,将该文 件复制到: C:\Program Files(x ...

  3. day-02

    昨天吧 需要写一个财务管理制度 很是伤脑 我发现一旦用脑过度 就会极其想吃零食 所以 昨天吃了些零食 说这个呢 无非是想说 我昨天学习python的时间很少 而且昨晚安装python软件也出现问题了 ...

  4. 编译Hadoop 2&period;7&period;2支持压缩 转

    hadoop Native Shared Libraries 使得Hadoop可以使用多种压缩编码算法,来提高数据的io处理性能.不同的压缩库需要依赖到很多Linux本地共享库文件,社区提供的二进制安 ...

  5. 网络请求&lpar;I&rpar;

    NSURLSession 代理方法 有的时候,我们可能需要监听网络请求的过程(如下载文件需监听文件下载进度),那么就需要用到代理方法. #import "ViewController.h&q ...

  6. C&num; HttpWebRequest 错误总结

    1.form data 需要编码!!! byte[] data = new ASCIIEncoding().GetBytes("pattern=0&wwid=古兴越&good ...

  7. arduino驱动安装

    方法一:使用官方提供的一键安装程序安装 打开Arduino在你电脑上的位置如果你的电脑是32位系统,就运行dpinst-x86.exe如果是64位系统,就运行dpinst-amd64.exe然后在弹出 ...

  8. （转阮一峰）深入理解OAuth 2&period;0

    OAuth是一个关于授权(authorization)的开放网络标准,在全世界得到广泛应用,目前的版本是2.0版. 本文对OAuth 2.0的设计思路和运行流程,做一个简明通俗的解释,主要参考材料为R ...

  9. php学习之路-笔记分享20150327

    由于公司需要,不得已是php也学习并用了段时间做了两个项目,现也分享出笔记.需要源文档的留下邮箱,.

  10. setUserVisibleHint-- fragment真正的onResume和onPause方法

    现在越来越多的应用会使用viewpager+fragment显示自己的内容页,fragment和activity有很多共同点,如下图就是fragment的生命周期 但是fragment和activit ...

相关文章