<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Flex Home &#187; 缓存</title>
	<atom:link href="http://flex.desizen.com/tag/%e7%bc%93%e5%ad%98/feed/" rel="self" type="application/rss+xml" />
	<link>http://flex.desizen.com</link>
	<description>又一个 flex 博客</description>
	<lastBuildDate>Thu, 01 Dec 2011 03:33:47 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>flex 客户端缓存 module swf</title>
		<link>http://flex.desizen.com/flex-client-cache/</link>
		<comments>http://flex.desizen.com/flex-client-cache/#comments</comments>
		<pubDate>Sat, 22 Aug 2009 07:35:25 +0000</pubDate>
		<dc:creator>warmC</dc:creator>
				<category><![CDATA[FLEX]]></category>
		<category><![CDATA[module]]></category>
		<category><![CDATA[swf]]></category>
		<category><![CDATA[缓存]]></category>

		<guid isPermaLink="false">http://flex.joelove.cn/?p=267</guid>
		<description><![CDATA[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： 配置文件&#8217;Cache_config.xml&#8217; &#60;data id=&#34;moduleOne&#34; version=&#34;beta01&#34;/&#62; &#60;data id=&#34;moduleTwo&#34; version=&#34;beta01&#34;/&#62; &#60;data id=&#34;mySwf&#34; version=&#34;beta01&#34;/&#62; *当然，配置文件的路径，和名字可以由你任取，但需要在版本控制时指定路径，下面将介绍如何启动版本控制 *id属性，标记这个缓存的名字，将会在全局使用，包括缓存的SharedObject名称，以及版本控制,下面读取缓存时将会使用到这个id *version版本控制，随你起名称。但是为了确保不会与以前的版本混淆，推荐最好还是使用递增的版本名称 首先必须在缓存的使用之前先启动版本控制，需要导入以下包： import WarmC.Cache.LocationDataProxy; 然后启动版本控制： LocationDataProxy.getInstance().CacheReBuild(0.5); CacheReBuild(size:int,configUrl:String)方法使用说明: * size参数,指定缓存的总大小，单位为兆（M），不填则默认为1M即运行到这个地方时，就会判断客户端的SharedObject 允许缓存大小，再提示用户修改缓存最大值设置如果你需要缓存的数据较大，则可对应取下面的值 size]]></description>
			<content:encoded><![CDATA[<p>flex或者flash客户端的缓存，并不是指浏览器的缓存，浏览器的缓存在一定时间后会过期，先作此声明。<br />
使用flex或者flash开发出来的网站最大的问题就是swf文件过大，国内网速有限，导致加载时间过长，这样会丢失很多潜在的客户。<br />
flex使用RSL技术，可以解决框架的缓存与共享，很大程度的解决了加载问题。但是如果项目过大，还是会导致加载时间很长这个问题。我使用了SharedObject进行客户端的SWF与Module的缓存，并进行版本控制。在服务器端做一个配置文件，客户端若有缓存过数据，则进行版本控制，达到客户端数据与服务器端数据保持一样。<span id="more-267"></span><br />
例子:<br />
     假设现在有个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也进行缓存。<br />
问题：<br />
     如果遇到客户端不允许缓存，则跳过缓存，无碍程序的加载和运行。<br />
     如果一个用户，多次的打开本网站，说明对本网站有了一定的兴趣，在多次被询问是否允许缓存后，点击允许的可能性也加    大。<br />
     当用户能够清楚的了解到缓存的好处时，允许缓存，一.可以加速用户体验，二.可以降低服务器压力，三.可以降低服务器带宽的使用。<br />
文章最后有一个Demo供下载测试使用，源代码暂时打包成SWC，未开放出来。<br />
下面将解释一下如何使用WarmC.swc：<br />
        <strong>配置文件&#8217;Cache_config.xml&#8217;</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">        <span style="color: #000000;">&lt;data id=<span style="color: #ff0000;">&quot;moduleOne&quot;</span> version=<span style="color: #ff0000;">&quot;beta01&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;">&lt;data id=<span style="color: #ff0000;">&quot;moduleTwo&quot;</span> version=<span style="color: #ff0000;">&quot;beta01&quot;</span><span style="color: #7400FF;">/&gt;</span></span>
	<span style="color: #000000;">&lt;data id=<span style="color: #ff0000;">&quot;mySwf&quot;</span> version=<span style="color: #ff0000;">&quot;beta01&quot;</span><span style="color: #7400FF;">/&gt;</span></span></pre></div></div>

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

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">import WarmC.Cache.LocationDataProxy;</pre></div></div>

<p>	<strong>然后启动版本控制：</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">LocationDataProxy.getInstance().CacheReBuild(0.5);</pre></div></div>

<p>CacheReBuild(size:int,configUrl:String)方法使用说明:<br />
* size参数,指定缓存的总大小，单位为兆（M），不填则默认为1M即运行到这个地方时，就会判断客户端的SharedObject 允许缓存大小，再提示用户修改缓存最大值设置如果你需要缓存的数据较大，则可对应取下面的值<br />
   size<=0 不提示，或者默认客户端的100Kb<br />
   0<size<1 缓存1Mb以内的数据<br />
   1<=size<10 缓存10Mb以内的数据<br />
   10<=size 缓存无限大的数据<br />
   例如：你需要缓存的文件总大小为700K，你可以设置size=0.7,这样子，就会在启动版本控制的是很对用户进行询问，而且保证用户同意缓存以后不会再次询问<br />
* configUrl,是指配置文件XML地址，默认是在根目录'Cache_config.xml'，必须指定，并且配置文件格式必须与Demo格式一致<br />
* 当配置文件正确无误时，版本控制启动成功，会读取服务器端配置，与客户端缓存进行版本比较。版本不同的话，将客户端缓存删除。如果版本控制启动失败，会导致客户端的缓存与服务器端的缓存无法同步。<br />
	<strong>设置缓存人性化功能</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">LocationDataProxy.getInstance().Warm_Human(true);</pre></div></div>

<p>         Warm_Human（bool:Boolean）说明:<br />
	* FlashPlayer的SharedObject，在使用超过客户端的设置大小后，就会提示用户，并征求其意见，是否同意网站的缓存<br />
        * 如果，在系统需要缓存多个数据时，而且用户拒绝了缓存，系统将会在每次需要写入SharedObject时，都进行询问是否允许缓存，这样的用户体验十分糟糕。<br />
        *当设置Warm_Huma为true时，在第一次提示用户是否允许程序缓存改大小后，如果用户拒绝了，以后的缓存将不会再提示，也不会再在客户端缓存，直到用户再次运行此程序（ <img src='http://flex.desizen.com/wp-includes/images/smilies/icon_biggrin.gif' alt=':grin:' class='wp-smiley' />  ，虽然是有点烦人，但嫌麻烦，多数人不会在意那几M的空间，而点了允许）<br />
	* false，不管用户是否拒绝，每次需要增大缓存区大小时，都会提示用户<br />
        * 不使用该方法，默认为true。所以这个方法很少用到。<br />
	<strong>确保版本控制启动成功后，可以进行module加载，先导入以下包：</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">import WarmC.Cache.ModuleCacheProxy;</pre></div></div>

<p>	<strong>加载module</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">ModuleCacheProxy.getInstance().load(&quot;moduleOne&quot;,&quot;ModuleOne.swf&quot;,onProgress,onReady);
function onProgress(bytesLoaded:uint,bytesTotal:uint):void{
	trace(&quot;&gt;加载ModuleOne:&quot;+bytesLoaded+&quot;/&quot;+bytesTotal);
}
function onReady(data:Object):void{
	trace(&quot;&gt;ModuleOne 加载完成!&quot;);
	Application.application.addChild(data as UIComponent);
}</pre></div></div>

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

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">import WarmC.Cache.SwfCacheProxy;</pre></div></div>

<p>        <strong>加载SWF:</strong></p>

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">SwfCacheProxy.getInstance().load(&quot;mySwf&quot;,&quot;test.swf&quot;,onProgress,onReady);
function onProgress(bytesLoaded:uint,bytesTotal:uint):void{
	trace(&quot;&gt;加载SWF:&quot;+bytesLoaded+&quot;/&quot;+bytesTotal);
}
function onReady(data:Object):void{
	trace(&quot;&gt;SWF 加载完成!&quot;);
	var load:Loader = new Loader()
	load.loadBytes( data as ByteArray );
	var uic:UIComponent=new UIComponent();
	uic.addChild(load); 
	Application.application.addChild(uic);
}</pre></div></div>

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

<div class="wp_syntax"><div class="code"><pre class="mxml" style="font-family:monospace;">private function loadModule2():void{
	ModuleCacheProxy.getInstance().load(&quot;moduleTwo&quot;,&quot;ModuleTwo.swf&quot;,onProgress,onReady);
	ModuleCacheProxy.getInstance().load(&quot;moduleTwo&quot;,&quot;ModuleTwo.swf&quot;,onProgress,onReady);
	function onProgress(bytesLoaded:uint,bytesTotal:uint):void{
		trace(&quot;&gt;加载ModuleTwo:&quot;+bytesLoaded+&quot;/&quot;+bytesTotal);
	}
	function onReady(data:Object):void{
		trace(&quot;&gt;ModuleTwo 加载完成!&quot;);
        	Application.application.addChild(data as UIComponent);
	}
}</pre></div></div>

<p>细心点，你就会发现，moduleTwo.swf使用ModuleCacheProxy加载了两次。嗯，这是为了演示一下，如果在一个swf还未加载完毕，再将他加载一遍，就会被拒绝。如果你想一次性将一个SWF加载多次（也可以说Copy多个Swf），将会遭到拒绝，你可以一个一个慢慢加载，在onReady方法里面加载。或者根本可以不用使用加载，直接使用复制，如何复制，自己去google啦。<br />
这样可以避免一点，加载缓存时很卡。 <img src='http://flex.desizen.com/wp-includes/images/smilies/icon_cry.gif' alt=':cry:' class='wp-smiley' /><br />
另外，做人得厚道点。别什么东西都往人家C盘上面塞。 <img src='http://flex.desizen.com/wp-includes/images/smilies/icon_evil.gif' alt=':evil:' class='wp-smiley' /><br />
罗嗦了这么多，看Demo吧。<a href="http://www.boxcn.net/shared/ciynrit51i" target="_blank">flex 客户端缓存 module swf</a> 如果发现什么Bug的话，欢迎留言…</p>
]]></content:encoded>
			<wfw:commentRss>http://flex.desizen.com/flex-client-cache/feed/</wfw:commentRss>
		<slash:comments>46</slash:comments>
		</item>
	</channel>
</rss>

