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

绪

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

           

问题分析

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

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

问题解决

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

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

美文美图

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. R语言do.call 函数用法详解

    虽然R语言有类型很丰富的数据结构,但是很多时候数据结构比较复杂,那么基本就会用到list这种结构的数据类型.但是list对象很难以文本的形式导出,因此需要一个函数能快速将复杂的list结构扁平化成da ...

  2. 01_自动化构建工具之Maven

    目前技术中存在问题(为什么使用Maven): 一个项目就是一个工程: 缺陷:如果项目太过庞大,就不适合使用package来划分层次,最好是一个模块就是一个工程,利于分工协作. 解决:Maven可以将一 ...

  3. U盘PE无人值守安装centOS6

    一.制作 1.需要用到的工具:老毛桃PX工具.系统ISO.一个8GU盘 老毛桃PE工具 http://laomaotao.net/ CentOS启动映像 http://mirrors.163.com/ ...

  4. PHP 序列化/反序列化的方法函数

    我们在开发的过程中常常遇到需要把对象或者数组进行序列号存储,反序列化输出的情况.特别是当需要把数组存储到mysql数据库中时,我们时常需要将数组进行序列号操作. 序列化(串行化):是将变量转换为可保存 ...

  5. 2017-暑假作业-Java语言程序设计

    任务列表 1.学会使用Markdown做笔记 本篇随笔就是使用的Markdown语法.养成做笔记的习惯! 参考资料: 极简MarkDown排版介绍(How to) stackedit:在线Markdo ...

  6. CSDN博客投票活动开始了

    自己坚持写博客,一方面是为了将自己对知识点的理解做一个总结,另一方面也是因为自己看到了很多无私奉献分享自己知识的小伙伴们,因此自己也想像他们那样尽自己微薄之力把自己对某一知识点的理解分享给大家,或许算 ...

  7. rbac数据库设计

    1 rbac数据库设计 RBAC基于资源的访问控制(Resource-Based Access Control)是以资源为中心进行访问控制分享牛原创,分享牛系列,分享牛.rbac 用户角色权限资源表如 ...

  8. 理解性能的奥秘——应用程序中慢，SSMS中快（2）——SQL Server如何编译存储过程

    本文属于<理解性能的奥秘--应用程序中慢,SSMS中快>系列 接上文:理解性能的奥秘--应用程序中慢,SSMS中快(1)--简介 本文介绍SQL Server如何编译存储过程并使用计划缓存 ...

  9. [ExtJS5学习笔记]第三十五节 sencha extjs 5 组件查询方法总结

    一个UI前台组件肯定会比较多,我们通常习惯性的使用ID来获取需要操作的组件,但是这种方法是extjs推荐的么?有没有extjs推荐使用的获取组件的方法呢? 目录 目录 extjs的查询组件的API 查 ...

  10. 如何使用Matlab产生对称矩阵

    有时候做实验需要使用对称矩阵,这里介绍如何使用Matlab产生随机的对称矩阵. 用例子说明一下:我要产生4X4的随机矩阵,要求是对称矩阵. 产生对称矩阵 A = rand(4); B = tril(A ...