`
sooxin
  • 浏览: 257661 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

flex缓存客户端

阅读更多

flex或者flash客户端的缓存,并不是指浏览器的缓存,浏览器的缓存在一定时间后会过期。

使用flex或者flash开发出来的网站最大的问题就是swf文件过大,国内网速有限,导致加载时间过长,这样会丢失很多潜在的客户。

flex使用RSL技术,可以解决框架的缓存与共享,很大程度的解决了加载问题。但是如果项目过大,还是会导致加载时间很长这个问题。我使用了SharedObject进行客户端的SWF与Module的缓存,并进行版本控制。在服务器端做一个配置文件,客户端若有缓存过数据,则进行版本控制,达到客户端数据与服务器端数据保持一样。

例子:


假设现在有个Application的项目,生成的Application.swf文件是2028K,客户端的下载速度是100k/s,则差不多需要使用20秒的时间。现在将Application中的部分源码抽出来,使用Module机制,变成Application.swf 428K,Module1.swf 1000K,Module2.swf 600K。不使用缓存的话,完整的加载完Application还是需要差不多20秒时间,若使用缓存,将Module1.swf与Module2.swf缓存在客户端,则只需要加载Application.swf的428K,差不多4秒时间,加上Moduel的读取2秒时间,最多也就6-7秒时间。效率很明显。而且还可以缓存其他的乱七八糟的东西,例如皮肤.swf,图片资源.swf等等.如果有跳转页面的话,还可以将Application.swf也进行缓存。

问题:

如果遇到客户端不允许缓存,则跳过缓存,无碍程序的加载和运行。
如果一个用户,多次的打开本网站,说明对本网站有了一定的兴趣,在多次被询问是否允许缓存后,点击允许的可能性也加 大。
当用户能够清楚的了解到缓存的好处时,允许缓存,一.可以加速用户体验,二.可以降低服务器压力,三.可以降低服务器带宽的使用。
文章最后有一个Demo供下载测试使用,源代码暂时打包成SWC,未开放出来。

下面将解释一下如何使用WarmC.swc:

配置文件Cache_config.xml

<data id="moduleOne" version="beta01"/>
<data id="moduleTwo" version="beta01"/>
<data id="mySwf" version="beta01"/>

*当然,配置文件的路径,和名字可以由你任取,但需要在版本控制时指定路径,下面将介绍如何启动版本控制
*id属性,标记这个缓存的名字,将会在全局使用,包括缓存的SharedObject名称,以及版本控制,下面读取缓存时将会使用到这个id
*version版本控制,随你起名称。但是为了确保不会与以前的版本混淆,推荐最好还是使用递增的版本名称

首先必须在缓存的使用之前先启动版本控制,需要导入以下包:

import WarmC.Cache.LocationDataProxy;

然后启动版本控制:

LocationDataProxy.getInstance().CacheReBuild(0.5);

CacheReBuild(size:int,configUrl:String)方法使用说明:


* size参数,指定缓存的总大小,单位为兆(M),不填则默认为1M即运行到这个地方时,就会判断客户端的SharedObject 允许缓存大小,再提示用户修改缓存最大值设置如果你需要缓存的数据较大,则可对应取下面的值
size<=0 不提示,或者默认客户端的100Kb
0

LocationDataProxy.getInstance().Warm_Human(true);

Warm_Human(bool:Boolean)说明:


* FlashPlayer的SharedObject,在使用超过客户端的设置大小后,就会提示用户,并征求其意见,是否同意网站的缓存
* 如果,在系统需要缓存多个数据时,而且用户拒绝了缓存,系统将会在每次需要写入SharedObject时,都进行询问是否允许缓存,这样的用户体验十分糟糕。
*当设置Warm_Huma为true时,在第一次提示用户是否允许程序缓存改大小后,如果用户拒绝了,以后的缓存将不会再提示,也不会再在客户端缓存,直到用户再次运行此程序.
* false,不管用户是否拒绝,每次需要增大缓存区大小时,都会提示用户
* 不使用该方法,默认为true。所以这个方法很少用到。
确保版本控制启动成功后,可以进行module加载,先导入以下包:

import WarmC.Cache.ModuleCacheProxy;

加载module

ModuleCacheProxy.getInstance().load("moduleOne","ModuleOne.swf",onProgress,onReady);
function onProgress(bytesLoaded:uint,bytesTotal:uint):void{
	trace(">加载ModuleOne:"+bytesLoaded+"/"+bytesTotal);
}
function onReady(data:Object):void{
	trace(">ModuleOne 加载完成!");
	Application.application.addChild(data as UIComponent);
}

* load(name:String,url:String,onProgress:Function,onReady:Function)说明:
* name,指的是Module在配置文件Cache_config文件中的ID,此处必须与配置文件一致。用于版本控制,以及
客户端的缓存文件名,通过name获取SharedObject
* url,指的是Module的Swf文件路径,Demo的Module文件均在根目录,所以直接指定名称
* onProgress,指加载Module时的进度回调方法,传回两个参数,bytesLoaded与bytesTotal,若需要显示进度条,则这个方法是必备的。如果缓存不存在,则bytesLoaded与bytesTotal会是从服务器端加载数据的值;
如果缓存已经存在,则该方法只调用一次,而且两个回传参数均是100
* onReady,指加载完成后的回调方法,传回一个UIComponent类型的参数data
* 代理器使用了饿汉单例模式,检测module是否已经缓存在客户端。
* 如果已经缓存在客户端,则直接读取
* 否则,从服务器端加载,显示,再缓存到客户端,打上版本。
加载SWF(非module),需导入以下包:

import WarmC.Cache.SwfCacheProxy;

加载SWF:

SwfCacheProxy.getInstance().load("mySwf","test.swf",onProgress,onReady);
function onProgress(bytesLoaded:uint,bytesTotal:uint):void{
	trace(">加载SWF:"+bytesLoaded+"/"+bytesTotal);
}
function onReady(data:Object):void{
	trace(">SWF 加载完成!");
	var load:Loader = new Loader()
	load.loadBytes( data as ByteArray );
	var uic:UIComponent=new UIComponent();
	uic.addChild(load); 
	Application.application.addChild(uic);
}

load(name:String,url:String,onProgress:Function,onReady:Function)说明:


*属性作用与ModuleCacheProxy一样
*唯一不同点,onReady方法的回传参数为一个ByteArray,需要自己进行包装目前使用起来就是这样。你可以使用SwfCacheProxy来缓存皮肤Style.swf,游戏插件,图片资源等等Swf数据。
在例子中,有个“加载Module 2”:

private function loadModule2():void{
	ModuleCacheProxy.getInstance().load("moduleTwo","ModuleTwo.swf",onProgress,onReady);
	ModuleCacheProxy.getInstance().load("moduleTwo","ModuleTwo.swf",onProgress,onReady);
	function onProgress(bytesLoaded:uint,bytesTotal:uint):void{
		trace(">加载ModuleTwo:"+bytesLoaded+"/"+bytesTotal);
	}
	function onReady(data:Object):void{
		trace(">ModuleTwo 加载完成!");
        	Application.application.addChild(data as UIComponent);
	}
}
分享到:
评论

相关推荐

    flex 客户端缓存

    Flex客户端缓存是一种技术,主要用于优化Flex应用的性能,尤其是对于那些包含大量SWF文件或者需要频繁更新数据的应用。在Flex3中,客户端缓存机制是开发者用来减少网络带宽消耗、提高用户交互速度的关键工具。本文将...

    Flex客户端IE浏览器缓存问题

    然而,当使用Flex开发的SWF文件部署到服务器时,可能会遇到一个常见的问题:在Internet Explorer(IE)浏览器中,用户可能无法获取到服务器端最新更新的SWF版本,而是继续显示旧的缓存版本。这个问题主要涉及到...

    openScale配置_Flex开源客户端

    WMS允许用户请求地图图像,WMS-C则提供了缓存机制以提高性能,而WFS则用于访问和操作地理空间特征。 配置OpenScales开发环境通常涉及以下步骤: 1. **安装GeoServer**: GeoServer是一个开放源码的GIS服务器,支持...

    blazeDs解决flex客户端与Server的远程通讯

    BlazeDS是Adobe公司推出的一款开源的服务器端技术,它主要负责实现Flex客户端与服务器之间的实时双向通信。Flex是一种用于构建富互联网应用程序(RIA)的客户端框架,而BlazeDS则是其背后的通信引擎,提供了数据推送...

    java 整合 flex项目

    在这样的架构中,Java通常作为服务器端处理业务逻辑和数据管理,而Flex则负责在客户端提供动态、交互式的用户界面。这种组合允许开发者利用Java的强大功能和Flex的出色用户体验设计。 **Java Hibernate整合** ...

    Spring Flex 整合

    Spring Flex整合是将Spring的服务器端功能与Flex的客户端展示能力相结合,以提供更强大的企业级应用解决方案。 在Spring Flex项目中,主要目标是简化Spring和Flex之间的通信,提供一个无缝的集成环境,使开发人员...

    FlexSpring jar包

    FlexSpring的集成允许开发者充分利用Flex的可视化设计和强大的客户端能力,同时利用Spring的强大后端服务,如数据访问、事务管理、安全控制等。这种结合提供了前后端分离的开发模式,提高了开发效率并降低了复杂性。...

    java连接flex代码

    7. **性能优化**:通过合理设计服务接口,减少不必要的网络往返,使用数据批处理,以及缓存策略等手段,可以优化Java-Flex应用的性能。 综上所述,Java连接Flex代码示例通常涉及到使用SSH框架,通过AMF协议实现高效...

    flex整合spring需要的spring相关包

    10. **性能优化**:通过缓存策略、减少不必要的网络请求、优化数据结构等方式,可以提升Flex-Spring应用的性能。 综上所述,整合Flex和Spring涉及的技术点包括通信协议、服务代理、配置文件、数据传输、安全、异常...

    flex用到JMS代码下载

    在这个场景下,你需要下载Tomcat,将Flex Blazeds JMS Demo应用部署到Tomcat中,使其成为Flex客户端与ActiveMQ交互的桥梁。 4. **BlazeDS**: BlazeDS是Adobe提供的一个免费服务器端组件,用于在Flex和Java应用...

    flex spring

    然后,定义ActionScript方法调用这个Service,将数据传递到服务器端,服务器端的Spring服务处理完业务逻辑后,通过AMF将结果返回给Flex客户端。 7. **安全和性能考虑** 在实际项目中,除了关注功能实现,还需要考虑...

    flex-webiter.jar.zip

    4. **缓存优化**:对于频繁访问的数据,Flex Webtier可以实现缓存策略,减少不必要的服务器请求,提高性能。 5. **数据管理**:它提供了对远程数据源的访问,例如通过 BlazeDS 或 LCDS(LiveCycle Data Services)...

    java flex jar包

    在Java和Flex的集成中,主要涉及的技术有Adobe BlazeDS、LCDS(LiveCycle Data Services)或者更现代的Apache Flex SDK,这些工具或库允许Java服务器与Flex客户端进行通信。它们提供了AMF(Action Message Format)...

    flex和hibernate的整合

    6. **缓存策略**:为了提高性能,可以利用Hibernate的二级缓存机制,以及在Flex客户端对数据进行适当的缓存。这可以减少不必要的服务器请求,提高用户体验。 7. **安全性**:整合过程中还需要考虑安全问题,如身份...

    flex+java+mysql登录

    在"flex+java+mysql登录"这个场景中,我们主要探讨的是如何使用Flex客户端与Java后台进行通信,以及通过Java处理数据库交互来实现用户登录功能。 1. Flex数据库操作:Flex中的数据访问通常通过 BlazeDS 或 LCDS ...

    Java_Flex,Java_Flex,Java_Flex

    1. BlazeDS:BlazeDS是Adobe官方提供的一个免费的中间件,它允许Java服务器与Flex客户端之间进行实时双向通信。BlazeDS支持AMF(Action Message Format)协议,这是一种高效的二进制数据格式,能大幅减少网络传输...

    Flex入门-Flex整合Servlet

    处理完成后,Servlet将结果封装成XML或JSON格式的数据,返回给Flex客户端,客户端再用这些数据更新用户界面。 整合Flex和Servlet的关键在于通信机制。Flex使用AMF(Action Message Format)协议,这是一种高效的...

    flex 与Java通讯

    4. Flex客户端开发:在Flex应用中创建RemoteObject或HTTPService,指定Java服务的URL和方法名。 5. 数据交换:Flex客户端调用Java服务,Java服务处理请求并返回结果,通过AMF或SOAP进行数据交换。 6. 错误处理与...

    整合spring+flex的web项目

    8. **优化性能**:通过缓存、异步请求、合理设计数据传输结构等方式优化Spring和Flex之间的通信,提高用户体验。 综上所述,整合Spring和Flex能构建出既具备强大后端服务又拥有出色用户体验的Web应用。通过灵活运用...

    AMFPHP与flex通讯

    2. **Flex客户端开发**:在Flex中,我们可以创建一个用户界面,包括输入框、发送按钮以及显示聊天消息的列表。使用`RemoteObject`组件,我们可以设置AMF通道并连接到AMFPHP服务器,以便发送和接收数据。 3. **...

Global site tag (gtag.js) - Google Analytics