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. Oracle中rownum的说明及使用技巧

    一.rownum的说明 rownum是oracle特有的一个关键字. (1)对于基表,在insert记录时,oracle就按照insert的顺序,将rownum分配给每一行记录,因此在select一个 ...

  2. ejabberd为游戏免除注册限制

    ejabberd为游戏免除注册限制 (金庆的专栏 2016.11) ejabberd聊天服务器默认会限制同一IP注册帐号须间隔600s. 在游戏中需要为每个角色注册一个聊天帐号,不应该有此限制. 可以 ...

  3. java.io.FileNotFoundException: D:\Program%20Files\Apache%20Software%20Foundation\Tomcat%205.0\webapp

    慢慢把以前遇到过的问题一点点发出来,以前做的笔记比较杂: java.io.FileNotFoundException: D:\Program%20Files\Apache%20Software%20F ...

  4. android studio 转为eclipse快捷键后还存在的问题汇总

    提取局部变量:Ctrl+Alt+V 提取全局变量:Ctrl+Alt+F 提取方法:Shit+Alt+M 使用android studio 出现红色下划线代表有错误产生,eclipse中的Ctrl+1( ...

  5. Android自定义View（LineBreakLayout－自动换行的标签容器）

      最近一段时间比较忙,都没有时间更新博客,今天公司的事情忙完得空,继续为我的自定义控件系列博客添砖加瓦.本篇博客讲解的是标签自动换行的布局容器,正好前一阵子有个项目中需要,想了想没什么难度就自己弄了 ...

  6. docker 部署cassandra

    摘要 本文主要介绍在redhat7 平台,利用docker 部署cassandra 集群,除了介绍基本的部署步骤,另外主要 讨论类似于cassandra 这种分布式集群系统部署 docker如何进行网 ...

  7. 如何使用Live CD来修复Grub / Grub2

    Introduction 一般我会在计算机上装两个或者多个系统,例如,我在计算机上安装了Ubuntu.Windows 7.Windows 8.1.有一天我的Win8.1不能正常使用了,我想重新安装Wi ...

  8. solr多集合配置

    1.1 多SolrCore配置 一个solr工程中可以配置多个SolrCore实例. 分享牛原创(尊重原创 转载对的时候第一行请注明,转载出处来自分享牛http://blog.csdn.net/qq_ ...

  9. Android的Ui层次

    UI 概览 Android 应用中的所有用户界面元素都是使用 View 和 ViewGroup 对象构建而成.View 对象用于在屏幕上绘制可供用户交互的内容.ViewGroup 对象用于储存其他 V ...

  10. Docker与容器

    Docker介绍 1. Docker 主要解决什么问题 Docker 对外宣称的是Build.Ship 和Run,Docker 要解决的核心问题就是快速地干这三件事情.它通过将运行环境和应用程序打包到 ...