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' *当然,配置文件的路径,和名字可以由你任取,但需要在版本控制时指定路径,下面将介绍如何启动版本控制
*id属性,标记这个缓存的名字,将会在全局使用,包括缓存的SharedObject名称,以及版本控制,下面读取缓存时将会使用到这个id
*version版本控制,随你起名称。但是为了确保不会与以前的版本混淆,推荐最好还是使用递增的版本名称
首先必须在缓存的使用之前先启动版本控制,需要导入以下包: 然后启动版本控制: CacheReBuild(size:int,configUrl:String)方法使用说明:
* size参数,指定缓存的总大小,单位为兆(M),不填则默认为1M即运行到这个地方时,就会判断客户端的SharedObject 允许缓存大小,再提示用户修改缓存最大值设置如果你需要缓存的数据较大,则可对应取下面的值
size
,虽然是有点烦人,但嫌麻烦,多数人不会在意那几M的空间,而点了允许)
* false,不管用户是否拒绝,每次需要增大缓存区大小时,都会提示用户
* 不使用该方法,默认为true。所以这个方法很少用到。
确保版本控制启动成功后,可以进行module加载,先导入以下包: 加载module ModuleCacheProxy.getInstance().load("moduleOne","M oduleOne.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,on Ready: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),需导入以下包: 加载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,on Ready:Function)说明:
*属性作用与ModuleCacheProxy一样
*唯一不同点,onReady方法的回传参数为一个ByteArray,需要自己进行包装目前使用起来就是这样。你可以使用SwfCacheProxy来缓存皮肤Style.swf,游戏插件,图片资源等等Swf数据。
在例子中,有个"加载Module 2": private function loadModule2():void{ ModuleCacheProxy.getInstance().load("moduleTwo","M oduleTwo.swf",onProgress,onReady); ModuleCacheProxy.getInstance().load("moduleTwo","M oduleTwo.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); } }
细心点,你就会发现,moduleTwo.swf使用ModuleCacheProxy加载了 两次。嗯,这是为了演示一下,如果在一个swf还未加载完毕,再将他加载一遍,就会被拒绝。如果你想一次性将一个SWF加载多次(也可以说Copy多个 Swf),将会遭到拒绝,你可以一个一个慢慢加载,在onReady方法里面加载。或者根本可以不用使用加载,直接使用复制,如何复制,自己去 google啦。
这样可以避免一点,加载缓存时很卡。
另外,做人得厚道点。别什么东西都往人家C盘上面塞。
罗嗦了这么多,看Demo吧。flex 客户端缓存 module swf 如果发现什么Bug的话,欢迎留言…
发表评论
-
C字符串分割
2012-07-06 09:51 1000来自:http://hi.baidu.com/alexin ... -
Source insight使用之正则表达式
2012-07-06 09:44 33221.正则表达式中必须包含群组,即\(\)包含的部分。这部分 ... -
正则表达式小探
2012-07-06 09:36 707正则表达式"(Regular Expressio ... -
Flex 4 新体验
2012-07-06 09:29 653直到最近才开始真 ... -
分页无刷新
2012-07-05 20:44 757var pageSize=3,currentPageNum ... -
核心Swing组件(七)
2012-07-03 13:42 844最后一个基本的Swing组件是JPanel组件。JPane ... -
核心Swing组件(七)
2012-07-03 12:15 557最后一个基本的Swing组件是JPanel组件。JPane ... -
FLEX实现关于
2012-07-02 10:10 623about.mxml List { backg ... -
Flex button icon动态设置
2012-07-02 10:09 612前段时间写了个datagrid的多列下拉选取控件: Mul ... -
flex cairngorm项目实战
2012-07-02 10:09 677项目功能与界面模仿阿布网站 系统功能: 新闻管 ... -
flex ant
2012-07-02 09:41 610... -
FLEX 条形图(柱状图)设置刻度为百分比
2012-07-01 09:26 1107作者原创,如需转载请注明出处:www.krzone.org ... -
谈谈我对未来的想法吧
2012-07-01 09:26 610来总行珠海研发中 ... -
JavaFX Script With Eclipse 入门
2012-07-01 09:26 672最近Java社区最火的就是JavaFX Script的发布 ... -
Linux网络入侵检测软件
2012-07-01 09:26 1319本软件是本人的毕业设计"作品"。当年是 ... -
Spring 3.0 整合 iBatis 3 Beta10 配置
2012-07-01 09:26 806弄了好长时间了,上网找各种资料,文档,最后发现Spring ... -
Flex Builder在卷接机组监控机中的应用―JSJ论文[网转]
2012-06-30 11:13 578Flex Builder在卷接机组监控机中的应用―JSJ论文[ ... -
Flex+PHP RIA应用开发实战详解
2012-06-30 11:13 751Flex+PHP RIA应用开发实战详解 2011年05月1 ... -
Flex 3.0程序开发技术详解
2012-06-30 11:13 612Flex 3.0程序开发技术详解 2011年05月10日 ... -
flex中设置Asserts.swc运行时类库的图片符号
2012-06-30 11:13 642flex中设置Asserts.swc运行时类库的图片符号 2 ...
相关推荐
flex3 客户端缓存 module 解决方案 swf文件缓存
解决Flex开发的swf服务器端最新版本,客户端IE浏览器需要手动设置,才可以显示服务器端最新的SWF版本问题
范例使用supermap iclient for Flex客户端裁剪地图。
flex客户端和服务端分页控件,后台使用java实现数据的传送,flex客户端调用服务端的webservices服务进行数据的展现~~ 内附myeclipse项目和flex项目·~ 分别导入可运行,注意端口的修改~
NULL 博文链接:https://morry.iteye.com/blog/387138
Flex中SWF和其他SWF文件之间的通信原理。该案例中TestLocalConnection为主SWF文件加载了TestLocalConnectionReceiver.SWF,两者之间是在同一个域下的通信,工程代码编译路径需要下载者手动修改下。其他技术细节参见...
Flex 加载 Module 模块开发 利用客户端缓存 Module 降低交互时间 这是一个DEMO
在eclipse_的一个项目中同时开发j2ee模块和flex_客户端模块
flex是妇科客户端编程的很好变现形式。
flex客户端导出excel所需的类库jar包(as3xls-1.0.1.swc)以及实例代码.支持mx.controls.DataGrid、mx.controls.AdvancedDataGrid、spark.components.DataGrid的excel导出。很不错的。
Flex中加载其他SWF动画时,需要控制引入的SWF的播放进度
动态分段是交通行业常用的功能之一,按照以往的实现方式,该功能通常都是在服务端来...由于富客户端的出现,很多功能都已可以移植到客户端来实现,现介绍使用SuperMap iClient 6R for Flex在客户端实现动态分段功能。
建立Flex客户端与J2EE服务端于同一(BlazeDS服务)工程, 解决了因MyEclipse版本过高而不兼容的问题.
在eclipse 的一个项目中同时开发j2ee模块和flex 客户端模块,里面有详细的过程步骤、截图
Eclipse通过wtp插件对j2ee web app的开发提供了很好的支持,flex builder plugin是基于eclipse 的一个用于开发flex 应用程序的插件,blazeds是一个用于集成flex 客户端和j2ee server的组件,下面介绍一种方法,集成...
Flex中加载SWF方法,介绍了flex 对 swf 加载和处理
原文:《使用easy eclipse,flex ...l 在 j2ee 视图中 release 产生的 war 文件中包含了最终的服务器代码和 flex 应用编译后的 swf 文件 , 可以直接部署 . 压缩包里是详细步骤、以及最终生成的eclipse 模板项目信息
一个简单的flex加载外部swf文件并对其进行操作的源码程序
the Flex 3 compiler module for J2EE application servers.
flex聊天程序客户端flex聊天程序客户端flex聊天程序客户端