1. Queue N Cache
by Aaron Hardy at 360|Flex 2010
view demos and code at AaronHardy.com

2. HELLO my name is
Aaron Hardy
Aaron Hardy aaronhardy.com

3. Extending Flex
Flex was written from day one to be an
open, extensible framework…Don’t like the
way Image behaves? Write your own Image
tag! Get enough people doing that, and
there’ll soon be a wealth of new and
improved frameworks and components out
there for everyone to choose from.
- Ely Greenfield
Aaron Hardy aaronhardy.com

4. Queue

5. Case Study – Studio J
Aaron Hardy aaronhardy.com

6. Case Study – Studio J
Aaron Hardy aaronhardy.com

7. Case Study – Studio J
Aaron Hardy aaronhardy.com

8. Case Study – Studio J
Aaron Hardy aaronhardy.com

9. Case Study – Studio J
Aaron Hardy aaronhardy.com

10. Case Study – Studio J
Aaron Hardy aaronhardy.com

11. Case Study – Studio J
Aaron Hardy aaronhardy.com

12. Case Study – Studio J
Aaron Hardy aaronhardy.com

13. Case Study – Studio J
Aaron Hardy aaronhardy.com

14. Case Study – Studio J
Aaron Hardy aaronhardy.com

15. Test App
Aaron Hardy aaronhardy.com

16. Generic Requests
View Screencast
Aaron Hardy aaronhardy.com

17. The Lunch Line
Aaron Hardy aaronhardy.com

18. Delay the Catalyst
URLRequest
Loader.load()
Context
URLLoader.load() URLRequest
URLRequest
FileReference.upload() DataFieldName
TestUpload
Command
NetConnection.call() Responder
Parameters
Aaron Hardy aaronhardy.com

19. Categorize Requests
Aaron Hardy aaronhardy.com

20. Categorize Requests
Aaron Hardy aaronhardy.com

21. Categorize Requests
Aaron Hardy aaronhardy.com

22. Priority Shifting
Lunch Lady #1
Lunch Lady #2
Kit Thumbnail Requests
Loader
URLRequest
Context
Pattern Thumbnail Requests
Aaron Hardy aaronhardy.com

23. Priority Shifting
Lunch Lady #1
Kit Thumbnail Requests
Lunch Lady #2
Pattern Thumbnail Requests
Loader
Kit Thumbnail Requests URLRequest
Context
Aaron Hardy aaronhardy.com

24. Priority Shifting
Lunch Lady #1
Kit Thumbnail Requests
Lunch Lady #2
Pattern Thumbnail Requests
Awaiting Retry
Kit Thumbnail Requests
Aaron Hardy aaronhardy.com

25. Requests with Priority Shifting
View Screencast
Aaron Hardy aaronhardy.com

26. Queue Combinations
Separate queue for uploads?
Separate queue for AMF requests?
Aaron Hardy aaronhardy.com

27. Green Threading
Emulating multiple threads using a single thread.
Aaron Hardy aaronhardy.com

28. Green Threading
Execute
Frame
Render
Aaron Hardy aaronhardy.com

29. Green Threading
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Aaron Hardy aaronhardy.com

30. Green Threading
Execute
Frame
Render
Execute
Frame
Render
other code
Execute
Frame execution
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Execute
Frame
Render
Aaron Hardy aaronhardy.com

31. Pros N Cons of Queuing
Pros
• Prioritizability
• Retryability
Cons
• Overhead
• Complexity
• Possible underutilization of server resources
Aaron Hardy aaronhardy.com

32. Cache

33. Duplicate Images
Aaron Hardy aaronhardy.com

34. Duplicate Images
Aaron Hardy aaronhardy.com

35. Duplicate Images
Aaron Hardy aaronhardy.com

36. Duplicate Images
Aaron Hardy aaronhardy.com

37. Duplicate Images
Aaron Hardy aaronhardy.com

38. Generic Loading of Duplicate Images
Aaron Hardy aaronhardy.com

39. Compressed vs. Uncompressed
1 JPG at 1200x900 = 152 KB
21 JPG x 152 KB = 3.1 MB
1 BitmapData at 1200x900 = 1,080,000 pixels * 4 bytes = 4.1 MB
21 BitmapData x 4.1 MB = 86.1 MB
BitmapData 27 times larger than JPG
(numbers are from test app and are only approximates)
Aaron Hardy aaronhardy.com

40. Generic Scrolling
View Screencast
Aaron Hardy aaronhardy.com

41. The Summer of George
Aaron Hardy aaronhardy.com

42. Locality of Reference
Temporal Locality:
A phenomenon in computer science
that states that if a value is referenced,
there is a high probability it will be
referenced again soon.
- Wikipedia
Aaron Hardy aaronhardy.com

43. Asset Sharing
adds request to queue
Portable Asset
initiates request, provides progress, stores bitmap data
Cache
Image Renderer
Aaron Hardy aaronhardy.com

44. Asset Sharing
adds request to queue
Portable Asset
initiates request, provides progress, stores bitmap data
Cache
Image Renderer Image Renderer
Aaron Hardy aaronhardy.com

45. Asset Invalidation
Invalidation
Cache
Image Renderer Image Renderer
Aaron Hardy aaronhardy.com

46. Asset Invalidation
Cache
Image Renderer Image Renderer
Aaron Hardy aaronhardy.com

47. Reference Management
1.jpg
2.jpg
3.jpg
4.jpg
5.jpg
6.jpg
7.jpg
Aaron Hardy aaronhardy.com

48. Reference Management
1.jpg
1
c
2.jpg 1 c
3.jpg 1
4.jpg 1
5.jpg Cache Queue
6.jpg
7.jpg
Aaron Hardy aaronhardy.com

49. Reference Management
1.jpg
0 c
2.jpg 1
c
3.jpg 1
4.jpg 1
5.jpg 1
6.jpg
Cache Queue
7.jpg
Aaron Hardy aaronhardy.com

50. Reference Management
1.jpg
2.jpg
3.jpg
4.jpg
5.jpg
6.jpg 1 c
7.jpg 2
c
2
1.jpg
2
2.jpg
1
3.jpg Cache Queue
4.jpg
5.jpg
6.jpg
7.jpg
Aaron Hardy aaronhardy.com

51. Loading Duplicate Images with Cache
Aaron Hardy aaronhardy.com

52. Scrolling with Cache
View Screencast
Aaron Hardy aaronhardy.com

53. Pros N Cons of Manual Caching
Pros
• Sharing of bitmap data (less memory usage)
• Faster bitmap re-access
Cons
• Overhead
• Complexity
• Possible use of more memory than necessary
Aaron Hardy aaronhardy.com

54. cacheAsBitmap
vector vector vector
display display display
TIME
Aaron Hardy aaronhardy.com

55. cacheAsBitmap
vector
bitmap bitmap bitmap
display display display
TIME
Aaron Hardy aaronhardy.com

56. cacheAsBitmap
Good: object is being translated
Bad: object is rotated and/or scaled
Aaron Hardy aaronhardy.com

57. cacheAsBitmap
6 vectors 6 bitmaps
6 bitmapdata
Aaron Hardy aaronhardy.com

58. Manual cacheAsBitmap
6 bitmaps
1 bitmapdata
vector bitmapdata
Aaron Hardy aaronhardy.com

59. cacheAsBitmap Off
Aaron Hardy aaronhardy.com

60. cacheAsBitmap On
Aaron Hardy aaronhardy.com

61. cacheAsBitmap Manual
Aaron Hardy aaronhardy.com

62. Thanks
check out demos and code at AaronHardy.com