<?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>ria-coder.com &#187; cache</title>
	<atom:link href="http://ria-coder.com/blog/tag/cache/feed" rel="self" type="application/rss+xml" />
	<link>http://ria-coder.com/blog</link>
	<description></description>
	<lastBuildDate>Wed, 21 Apr 2010 19:35:08 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>Truly Cached Flex Modules</title>
		<link>http://ria-coder.com/blog/truly-cached-flex-modules</link>
		<comments>http://ria-coder.com/blog/truly-cached-flex-modules#comments</comments>
		<pubDate>Sun, 31 Jan 2010 19:56:14 +0000</pubDate>
		<dc:creator>Danny Kopping</dc:creator>
				<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[cache]]></category>
		<category><![CDATA[caching]]></category>
		<category><![CDATA[modules]]></category>

		<guid isPermaLink="false">http://ria-coder.com/blog/?p=532</guid>
		<description><![CDATA[I was working on a project recently and I discovered (or possibly misunderstood - see disclaimer) that Flex does not cache modules correctly, or - at the very least - it does not do it effectively according to my tests.]]></description>
			<content:encoded><![CDATA[<p>I was working on a project recently and I discovered (or possibly misunderstood &#8211; see disclaimer) that Flex does <strong>not</strong> cache modules correctly, or &#8211; at the very least &#8211; it does not do it effectively according to my tests.</p>
<p><em>My test was conducted using Flex SDK <strong>3.4.0.9271, </strong>Firefox <strong>3.5.7 </strong>and <strong>Flex Builder Professional 3.0.214193</strong></em></p>
<p>According to <a title="Adobe LiveDocs" href="http://livedocs.adobe.com/flex/3/html/help.html?content=modular_5.html" target="_blank">this</a> page (under the <strong>Preloading modules</strong> heading), Adobe asserts the following:</p>
<blockquote><p>When a module is loaded by the Flex application for the first time, the module&#8217;s SWF file is transferred across the network and stored in the browser&#8217;s cache. If the Flex application unloads that module, but then later reloads it, there should be less wait time because Flash Player loads the module from the cache rather than across the network.</p>
<p>Module SWF files, like all SWF files, reside in the browser&#8217;s cache unless and until a user clears them. As a result, modules can be loaded by the main application across several sessions, reducing load time; but this depends on how frequently the browser&#8217;s cache is flushed.</p></blockquote>
<p>I found the above claims to be demonstrably false, or at least just plain inefficient&#8230;</p>
<p>Let me qualify this:<br />
According to my tests (conducted with my Firefox browser cache turned both on and off), i found that the application&#8217;s memory usage keeps growing exponentially when switching between two loaded modules. There was a variance (as you&#8217;d imagine) when the browser cache was left on but nonetheless, the memory usage keeps growing steadily.</p>
<p>In the code sample below, I have extended the functionality of the <strong>mx.modules.ModuleLoader</strong> class, and added a Dictionary (with a little logic) to manage the (ostensibly) effective caching of previously loaded modules. I have not tested this class extensively, but all the tests that I conducted seemed to produce a significant memory and speed improvement.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
</pre></td><td class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #9900cc; font-weight: bold;">package</span>
<span style="color: #000000;">&#123;</span>
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.display</span>.<span style="color: #004993;">DisplayObject</span>;
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.display</span>.<span style="color: #004993;">DisplayObjectContainer</span>;
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.utils</span>.<span style="color: #004993;">ByteArray</span>;
	<span style="color: #0033ff; font-weight: bold;">import</span> <span style="color: #004993;">flash.utils</span>.<span style="color: #004993;">Dictionary</span>;
&nbsp;
	<span style="color: #0033ff; font-weight: bold;">import</span> mx.events.FlexEvent;
	<span style="color: #0033ff; font-weight: bold;">import</span> mx.events.ModuleEvent;
	<span style="color: #0033ff; font-weight: bold;">import</span> mx.modules.IModuleInfo;
	<span style="color: #0033ff; font-weight: bold;">import</span> mx.modules.ModuleLoader;
	<span style="color: #0033ff; font-weight: bold;">import</span> mx.modules.ModuleManager;
&nbsp;
	<span style="color: #3f5fbf;">/**
	 * This class manages the loading, unloading and caching of Flex Modules
	 * This is a modified version of the mx.modules.ModuleLoader class
	 *
	 * @author Danny Kopping - danny@ria-coder.com
	 */</span>
	<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #9900cc; font-weight: bold;">class</span> CachedModuleLoader extends ModuleLoader
	<span style="color: #000000;">&#123;</span>
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #6699cc; font-weight: bold;">var</span> <span style="color: #004993;">map</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">Dictionary</span> = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">Dictionary</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #6699cc; font-weight: bold;">var</span> _url<span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">String</span> = <span style="color: #0033ff; font-weight: bold;">null</span>;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #6699cc; font-weight: bold;">var</span> module<span style="color: #000000; font-weight: bold;">:</span>IModuleInfo;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #6699cc; font-weight: bold;">var</span> loadRequested<span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">Boolean</span> = <span style="color: #0033ff; font-weight: bold;">false</span>;
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> CachedModuleLoader<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">super</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		override <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> <span style="color: #0033ff; font-weight: bold;">set</span> <span style="color: #004993;">url</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">value</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">String</span><span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span><span style="color: #004993;">value</span> == _url<span style="color: #000000;">&#41;</span>
				<span style="color: #0033ff; font-weight: bold;">return</span>;
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>module<span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">PROGRESS</span>, moduleProgressHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.SETUP, moduleSetupHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.READY, moduleReadyHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">ERROR</span>, moduleErrorHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">UNLOAD</span>, moduleUnloadHandler<span style="color: #000000;">&#41;</span>;
&nbsp;
				<span style="color: #009900;">//module.release();</span>
				module = <span style="color: #0033ff; font-weight: bold;">null</span>;
&nbsp;
				<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span>
				<span style="color: #000000;">&#123;</span>
					<span style="color: #004993;">removeChild</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span>;
					<span style="color: #009900;">//child = null;</span>
				<span style="color: #000000;">&#125;</span>
			<span style="color: #000000;">&#125;</span>
&nbsp;
			_url = <span style="color: #004993;">value</span>;
&nbsp;
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span><span style="color: #0033ff; font-weight: bold;">new</span> FlexEvent<span style="color: #000000;">&#40;</span>FlexEvent.URL_CHANGED<span style="color: #000000;">&#41;</span><span style="color: #000000;">&#41;</span>;
			removeAllChildren<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>_url <span style="color: #000000; font-weight: bold;">!</span>= <span style="color: #0033ff; font-weight: bold;">null</span> <span style="color: #000000; font-weight: bold;">&amp;&amp;</span> loadRequested<span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #0033ff; font-weight: bold;">if</span><span style="color: #000000;">&#40;</span><span style="color: #000000; font-weight: bold;">!</span><span style="color: #004993;">map</span><span style="color: #000000;">&#91;</span>_url<span style="color: #000000;">&#93;</span><span style="color: #000000;">&#41;</span>
					loadModule<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
				<span style="color: #0033ff; font-weight: bold;">else</span>
				<span style="color: #000000;">&#123;</span>
&nbsp;
					<span style="color: #004993;">child</span> = <span style="color: #004993;">map</span><span style="color: #000000;">&#91;</span>_url<span style="color: #000000;">&#93;</span>;
					<span style="color: #004993;">addChild</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span>;
				<span style="color: #000000;">&#125;</span>
			<span style="color: #000000;">&#125;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		override <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> <span style="color: #0033ff; font-weight: bold;">get</span> <span style="color: #004993;">url</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">String</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">return</span> _url;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		override <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> createComponentsFromDescriptors<span style="color: #000000;">&#40;</span>recurse<span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">Boolean</span> = <span style="color: #0033ff; font-weight: bold;">true</span><span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">super</span>.createComponentsFromDescriptors<span style="color: #000000;">&#40;</span>recurse<span style="color: #000000;">&#41;</span>;
&nbsp;
			loadRequested = <span style="color: #0033ff; font-weight: bold;">true</span>;
			loadModule<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		override <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> loadModule<span style="color: #000000;">&#40;</span><span style="color: #004993;">url</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">String</span> = <span style="color: #0033ff; font-weight: bold;">null</span>, bytes<span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">ByteArray</span> = <span style="color: #0033ff; font-weight: bold;">null</span><span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span><span style="color: #004993;">url</span> <span style="color: #000000; font-weight: bold;">!</span>= <span style="color: #0033ff; font-weight: bold;">null</span><span style="color: #000000;">&#41;</span>
				_url = <span style="color: #004993;">url</span>;
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>_url == <span style="color: #0033ff; font-weight: bold;">null</span><span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #009900;">//trace(&quot;loadModule() - null url&quot;);</span>
				<span style="color: #0033ff; font-weight: bold;">return</span>;
			<span style="color: #000000;">&#125;</span>
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span><span style="color: #004993;">map</span><span style="color: #000000;">&#91;</span>_url<span style="color: #000000;">&#93;</span><span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #009900;">//trace(&quot;loadModule() - already created the child&quot;);</span>
				<span style="color: #0033ff; font-weight: bold;">return</span>;
			<span style="color: #000000;">&#125;</span>
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>module<span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #009900;">//trace(&quot;loadModule() - load already initiated&quot;);</span>
				<span style="color: #0033ff; font-weight: bold;">return</span>;
			<span style="color: #000000;">&#125;</span>
&nbsp;
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span><span style="color: #0033ff; font-weight: bold;">new</span> FlexEvent<span style="color: #000000;">&#40;</span>FlexEvent.LOADING<span style="color: #000000;">&#41;</span><span style="color: #000000;">&#41;</span>;
&nbsp;
			module = ModuleManager.getModule<span style="color: #000000;">&#40;</span>_url<span style="color: #000000;">&#41;</span>;
&nbsp;
			module.<span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">PROGRESS</span>, moduleProgressHandler<span style="color: #000000;">&#41;</span>;
			module.<span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.SETUP, moduleSetupHandler<span style="color: #000000;">&#41;</span>;
			module.<span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.READY, moduleReadyHandler<span style="color: #000000;">&#41;</span>;
			module.<span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">ERROR</span>, moduleErrorHandler<span style="color: #000000;">&#41;</span>;
			module.<span style="color: #004993;">addEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">UNLOAD</span>, moduleUnloadHandler<span style="color: #000000;">&#41;</span>;
&nbsp;
			module.<span style="color: #004993;">load</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">applicationDomain</span>, <span style="color: #0033ff; font-weight: bold;">null</span>, bytes<span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		override <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> unloadModule<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span> <span style="color: #000000; font-weight: bold;">&amp;&amp;</span> <span style="color: #004993;">contains</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span><span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #004993;">removeChild</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span>;
				<span style="color: #004993;">child</span> = <span style="color: #0033ff; font-weight: bold;">null</span>;
			<span style="color: #000000;">&#125;</span>
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span>module<span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">PROGRESS</span>, moduleProgressHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.SETUP, moduleSetupHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.READY, moduleReadyHandler<span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">ERROR</span>, moduleErrorHandler<span style="color: #000000;">&#41;</span>;
&nbsp;
				module.<span style="color: #004993;">unload</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
				module.<span style="color: #004993;">removeEventListener</span><span style="color: #000000;">&#40;</span>ModuleEvent.<span style="color: #004993;">UNLOAD</span>, moduleUnloadHandler<span style="color: #000000;">&#41;</span>;
				module = <span style="color: #0033ff; font-weight: bold;">null</span>;
			<span style="color: #000000;">&#125;</span>
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">map</span><span style="color: #000000;">&#91;</span>_url<span style="color: #000000;">&#93;</span><span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #0033ff; font-weight: bold;">delete</span> <span style="color: #004993;">map</span><span style="color: #000000;">&#91;</span>_url<span style="color: #000000;">&#93;</span>;
			<span style="color: #000000;">&#125;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> moduleProgressHandler<span style="color: #000000;">&#40;</span>event<span style="color: #000000; font-weight: bold;">:</span>ModuleEvent<span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span>event<span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> moduleSetupHandler<span style="color: #000000;">&#40;</span>event<span style="color: #000000; font-weight: bold;">:</span>ModuleEvent<span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #009900;">// Not ready for creation yet, but can call factory.info().</span>
&nbsp;
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span>event<span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> moduleReadyHandler<span style="color: #000000;">&#40;</span>event<span style="color: #000000; font-weight: bold;">:</span>ModuleEvent<span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #004993;">child</span> = module.factory.create<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span> <span style="color: #0033ff; font-weight: bold;">as</span> <span style="color: #004993;">DisplayObject</span>;
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span>event<span style="color: #000000;">&#41;</span>;
&nbsp;
			<span style="color: #0033ff; font-weight: bold;">if</span> <span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span>
			<span style="color: #000000;">&#123;</span>
				<span style="color: #6699cc; font-weight: bold;">var</span> p<span style="color: #000000; font-weight: bold;">:</span><span style="color: #004993;">DisplayObjectContainer</span> = <span style="color: #004993;">parent</span>;
				<span style="color: #009900;">// p.removeChild(this);</span>
				<span style="color: #004993;">addChild</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">child</span><span style="color: #000000;">&#41;</span>;
&nbsp;
				<span style="color: #004993;">map</span><span style="color: #000000;">&#91;</span><span style="color: #004993;">url</span><span style="color: #000000;">&#93;</span> = <span style="color: #004993;">child</span>;<span style="color: #009900;">//ModuleManager.getModule(_url);</span>
				<span style="color: #009900;">//trace(map + &quot;:&quot; + url + &quot;:&quot; + map[url]);</span>
			<span style="color: #000000;">&#125;</span>
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> moduleErrorHandler<span style="color: #000000;">&#40;</span>event<span style="color: #000000; font-weight: bold;">:</span>ModuleEvent<span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			unloadModule<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span>;
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span>event<span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
&nbsp;
		<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> moduleUnloadHandler<span style="color: #000000;">&#40;</span>event<span style="color: #000000; font-weight: bold;">:</span>ModuleEvent<span style="color: #000000;">&#41;</span><span style="color: #000000; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span>
		<span style="color: #000000;">&#123;</span>
			<span style="color: #004993;">dispatchEvent</span><span style="color: #000000;">&#40;</span>event<span style="color: #000000;">&#41;</span>;
		<span style="color: #000000;">&#125;</span>
	<span style="color: #000000;">&#125;</span>
<span style="color: #000000;">&#125;</span></pre></td></tr></table></div>

<p>The usage of this class is exactly the same as the regular <strong>mx.modules.ModuleLoader</strong> class. I hope this helps!</p>
<p><strong>Download this file:</strong> <a href="http://ria-coder.com/blog/wp-content/uploads/2010/01/CachedModuleLoader.as">Download</a></p>
<p><strong>**DISCLAIMER**<br />
<span style="font-weight: normal; ">I know a bit about Flex modules from hours of obsessing over them, but i <span style="text-decoration: underline;">do not know everything</span>. From my tests of the efficacy of the above code &amp; explanation, i found that it reduces memory usage and increases the general usability of my Flex project; i could be very wrong on this topic, and if i am &#8211; please tell me. Maybe i&#8217;m just an idiot, but it seems to work&#8230;</span></strong></p>
]]></content:encoded>
			<wfw:commentRss>http://ria-coder.com/blog/truly-cached-flex-modules/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Fixing that annoying feature of List controls</title>
		<link>http://ria-coder.com/blog/fixing-that-annoying-feature-of-list-controls</link>
		<comments>http://ria-coder.com/blog/fixing-that-annoying-feature-of-list-controls#comments</comments>
		<pubDate>Sun, 15 Nov 2009 21:57:07 +0000</pubDate>
		<dc:creator>Danny Kopping</dc:creator>
				<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[cache]]></category>
		<category><![CDATA[creationPolicy]]></category>
		<category><![CDATA[offscreen]]></category>
		<category><![CDATA[tilelist]]></category>

		<guid isPermaLink="false">http://ria-coder.com/blog/?p=469</guid>
		<description><![CDATA[Learn how to fix that ever-painful "optimization" feature of Flex's list components]]></description>
			<content:encoded><![CDATA[<p>Don&#8217;t you just hate it&#8230; Doesn&#8217;t it just piss you off when you want to display a gallery of images in Flex and Flex decides that it&#8217;s actually going to set it so that when you scroll, it&#8217;ll <em>only</em> <em>then</em> load the images displayed offscreen? I find this particularly &#8220;ball-ache-ish&#8221; with the TileList component.</p>
<p>I was browsing through the documentation like i had many times before, but this time i noticed the <strong>offscreenExtraRowsOrColumns</strong> property. At first you think &#8220;wtf&#8221; but then i got curious&#8230;</p>
<p>Say you have 25 images in a grid that displays one row of 5 images at a time:</p>
<table border="0" width="200">
<tbody>
<tr style="background-color:#C7E811">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<p>The row in green will be the only row visible at this point in time. When you scroll, Flex will chuck out the first row and create the second row:</p>
<table border="0" width="200">
<tbody>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#C7E811">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="background-color:#DDDDDD">
<td height="10px"></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<p>&#8230;and so on. Isn&#8217;t that just damn irritating? (If you&#8217;re thinking &#8220;nah, what&#8217;s the big deal?&#8221; then you obviously haven&#8217;t tried this before).</p>
<p>Anyway, the way to fix it is to tell Flex how many rows there are offscreen so that it can create them in the interim. This seems like a bit of a weird method because in the navigator classes (ViewStack, et al) there is a <strong>creationPolicy</strong> property which &#8211; when set to &#8220;all&#8221; &#8211; will create all the non-visible components before they&#8217;re navigated to, thus slowing down the processing a bit (depending on your app) but also speeding up the switch between views. Alas, no such property to be found in the TileList component. Can anybody tell me why? I think i should code a modified version of the TileList component to accept this property&#8230; <em>+1 to TODO list&#8230; *sigh*</em></p>
<p>Hopefully this will help those of you experiencing the ball-ache that i did.</p>
]]></content:encoded>
			<wfw:commentRss>http://ria-coder.com/blog/fixing-that-annoying-feature-of-list-controls/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
