Outernauts: From AAA Console to AAA Flash Joe Valenzuela Insomniac - - PowerPoint PPT Presentation

▶
outernauts from aaa console to aaa flash
SMART_READER_LITE
LIVE PREVIEW

Outernauts: From AAA Console to AAA Flash Joe Valenzuela Insomniac - - PowerPoint PPT Presentation

Apr 04, 2024 158 likes •867 views

Outernauts: From AAA Console to AAA Flash Joe Valenzuela Insomniac Games Friday, April 19, 13 Outernauts: From AAA Console to AAA Flash Joe Valenzuela Insomniac Games Friday, April 19, 13 Insomniac Games Friday, April 19, 13 Friday,

slide-1
SLIDE 1

Joe Valenzuela

Insomniac Games

Outernauts: From AAA Console to AAA Flash

Friday, April 19, 13

slide-2
SLIDE 2

Joe Valenzuela

Insomniac Games

Outernauts: From AAA Console to AAA Flash

Friday, April 19, 13

slide-3
SLIDE 3

Insomniac Games

Friday, April 19, 13

slide-4
SLIDE 4

Friday, April 19, 13

slide-5
SLIDE 5

Friday, April 19, 13

slide-6
SLIDE 6

Friday, April 19, 13

slide-7
SLIDE 7

Basic Info

  • Flash/AS3 game client
  • LAMP on Amazon (AWS) app servers
  • nginx load balancing
  • REST based app server
  • dbShards with mysql interface

Friday, April 19, 13

slide-8
SLIDE 8

Terminology

Friday, April 19, 13

slide-9
SLIDE 9

Tile

Friday, April 19, 13

slide-10
SLIDE 10

Moby

Friday, April 19, 13

slide-11
SLIDE 11

flash.display.*

DisplayObject Bitmap Shape Sprite MovieClip

Friday, April 19, 13

slide-12
SLIDE 12

Shape

DisplayList

MovieClip MovieClip Bitmap Shape

Friday, April 19, 13

slide-13
SLIDE 13

Outernauts metrics

  • 52 production levels
  • 5968 assets
  • 786 audio files
  • 1599 avatar/890 monster animations
  • 1240 tiles
  • ~150000 LOC (ActionScript3)
  • ~20 man-years

Friday, April 19, 13

slide-14
SLIDE 14

Lessons

  • Flash
  • Vector DisplayObjects: use judiciously
  • Keep DisplayList short & simple
  • Idioms reflect scale
  • Retain your best practices
  • Memory rigor
  • Separate simulation vs rendering

Friday, April 19, 13

slide-15
SLIDE 15

Sprite GameObj Moby Monster Pet Avatar Tile

Is-a renderable

Friday, April 19, 13

slide-16
SLIDE 16

Sprite GameObj Moby Monster Pet Avatar Tile

Is-a renderable

Friday, April 19, 13

slide-17
SLIDE 17

Sprite GameObj Moby Monster Pet Avatar Tile

Is-a renderable

Friday, April 19, 13

slide-18
SLIDE 18

CPU: hotspots

  • GC costs
  • Stringy
  • Flash Anti-Patterns

Friday, April 19, 13

slide-19
SLIDE 19

Event Mania

GameObj Playfield ? GameObj ? GameObj ?

Friday, April 19, 13

slide-20
SLIDE 20

private function set x(value:Number):void { super.x = value; dispatch(CustomEvent(GameObj.CHANGE_POSITION)); } private function set y(value:Number):void { super.y = value; dispatch(CustomEvent(GameObj.CHANGE_POSITION)); }

Event Mania

GameObj

Friday, April 19, 13

slide-21
SLIDE 21

Compulsive Listening

GameObj GameObj GameObj GameObj GameObj

{ for each (var obj:GameObj in getAllObjects())

  • bj.addEventListener(GameObj.CHANGE_POSITION,

doStuff); } static public function doStuff(e:Event):void { var gameObj:GameObj = e.target as GameObj; if (gameObj.isSpecial()) doSomething(gameObj); }

Playfield

Friday, April 19, 13

slide-22
SLIDE 22

Hash addiction

x: -14 y: 10 z: 0 x: -14 y: 10 z: 0 “-12,9,-1” “-13,2,-1” “-14,10,0” 1 1 1 IsoVec IsoVec Object

Friday, April 19, 13

slide-23
SLIDE 23

Abstractogeddon

id: 200015 name: Joe Valenzuela pets: [ ... ] xp: 576 level: 5 name: “xp” value: “576”

Player IoTrackedField IoTrackedClass

name: “level” value: “5”

IoTrackedField

name: “pets” value:[ ... ]

IoTrackedField

Friday, April 19, 13

slide-24
SLIDE 24

Abstractogeddon

id: 200015 name: Joe Valenzuela pets: [ ... ] xp: 576 level: 5 name: “xp” value: “576”

Player IoTrackedField IoTrackedClass

name: “level” value: “5”

IoTrackedField

name: “pets” value:[ ... ]

IoTrackedField

if (foo["xp"] != oldVal["xp"]) {

  • ldVal["xp"] = foo["xp"];

serialize(foo["xp"]); }

Friday, April 19, 13

slide-25
SLIDE 25

Memory breakdown

  • 300-600MB. Peaks to 1GB.
  • Bitmap data
  • Flash Runtime data
  • Volatility

9.4 35.2 175.8 16.5 203.1 Other (Flash Runtime) Global (XML) Bitmap Exe Dynamic Data

Friday, April 19, 13

slide-26
SLIDE 26

Reducing Memory Volatility

  • Object pooling
  • Single-threaded scratch space aliasing
  • MovieClips (esp offscreen)
  • Activation Objects

Friday, April 19, 13

slide-27
SLIDE 27

Activation Objects

  • Capture environment (closures)
  • Generated implicitly (try/catch, nested

functions)

  • Affects code generation

Friday, April 19, 13

slide-28
SLIDE 28

Activation Objects

public function add0(a:int, b:int):int { return a+b; } public function add1(a:int, b:int):int { function dummy():void { } return a+b; } function add0(:int, :int)::int getlocal0 pushscope getlocal1 getlocal2 add returnvalue

Friday, April 19, 13

slide-29
SLIDE 29

Activation Objects

public function add0(a:int, b:int):int { return a+b; } public function add1(a:int, b:int):int { function dummy():void { } return a+b; }

function add1(:int, :int)::int getlocal0 pushscope newactivation dup setlocal3 pushscope getscopeobject 1 getlocal1 setslot 1 getscopeobject 1 getlocal2 setslot 2 getscopeobject 1 newfunction no name coerce :Function setslot 3 getscopeobject 1 getslot 1 getscopeobject 1 getslot 2 add returnvalue

Friday, April 19, 13

slide-30
SLIDE 30

Rendering

  • Vector slow/Bitmap fast
  • Runtime bitmap conversion
  • Better data sharing
  • DisplayList too long
  • Bitmap background

Friday, April 19, 13

slide-31
SLIDE 31

Runtime Bitmap Conversion

Traditional approach: SpriteSheets

Friday, April 19, 13

slide-32
SLIDE 32

Runtime Bitmap Conversion

Traditional approach: SpriteSheets

Friday, April 19, 13

slide-33
SLIDE 33

Runtime Bitmap Conversion

Hybrid approach: BitmapData Array

Friday, April 19, 13

slide-34
SLIDE 34

Runtime Bitmap Conversion

Hybrid approach: BitmapData Array

Friday, April 19, 13

slide-35
SLIDE 35
  • 12

33ms 66ms 100ms 133ms 166ms 0 players 32 players 64 players 96 players 128 players

Vector Bitmap CustomizedVector

Friday, April 19, 13

slide-36
SLIDE 36

Bitmap Background

Friday, April 19, 13

slide-37
SLIDE 37

Bitmap Background

  • Aqualos region 0: 2371 tiles

Friday, April 19, 13

slide-38
SLIDE 38

Bitmap Background

  • Aqualos region 0: 434 tiles (82%)

Friday, April 19, 13

slide-39
SLIDE 39

Bitmap Background

  • Required separate

simulation state from rendering

Friday, April 19, 13

slide-40
SLIDE 40

0fps 15fps 30fps

Bitmapped Background No Bitmapped Background

Hybrid Static Vector

Friday, April 19, 13

slide-41
SLIDE 41

0mb 350mb 700mb

Bitmapped Background No Bitmapped Background

Hybrid Static Vector

Friday, April 19, 13

slide-42
SLIDE 42

0fps 15fps 30fps

Bitmapped Background No Bitmapped Background

Hybrid Static Vector

Friday, April 19, 13

slide-43
SLIDE 43

0mb 300mb 600mb

Bitmapped Background No Bitmapped Background

Hybrid Static Vector

Friday, April 19, 13

slide-44
SLIDE 44

Loading

  • ~15MB data download
  • 3MB client, 1MB global data
  • level data, assets
  • browser caching
  • Content Delivery Network (CDN)
  • Aggregated asset loading

Friday, April 19, 13

slide-45
SLIDE 45

Internet Loading

Friday, April 19, 13

slide-46
SLIDE 46

Internet Loading

{ timings: { blocked: 72, dns: -1, connect: -1, send: 0, wait: 37, receive: 1, ssl: -1 } }

Friday, April 19, 13

slide-47
SLIDE 47

RegionCache: aggregated assets

at1_bldg1 at_bubbles at1_deco_27 home_deco_41 aqualos region 0 cache at1_bldg1 at_bubbles at1_deco_27 at_bubbles home_deco_41

Friday, April 19, 13

slide-48
SLIDE 48

Aggregated SWF: mxmlc toolchain

public class aqualos_regioncache_0 extends Sprite { public const version:int = REGION_CACHE_VERSION; public const num:int = 1; public var swfs:Dictionary = new Dictionary(true); [Embed('home_deco_41.swf', mimeType='application/octet-stream')] private var aqualos_regioncache_0_0:Class; public function aqualos_regioncache_0():void { var class0:Class = new aqualos_regioncache_0_0(); swfs["assets/tiles/home_deco_41.swf"] = ByteArrayAsset(new class0); } }

Friday, April 19, 13

slide-49
SLIDE 49

Caching Injection

Client Asset Cache home_deco_41 loose file

Friday, April 19, 13

slide-50
SLIDE 50

Caching Injection

Client Asset Cache

Asset request

home_deco_41 loose file

Friday, April 19, 13

slide-51
SLIDE 51

Caching Injection

Client Asset Cache

Asset request

home_deco_41 loose file

loadBytes(loader.bytes)

Friday, April 19, 13

slide-52
SLIDE 52

Caching Injection

aqualos region 0 cache Client Asset Cache

Asset request

home_deco_41 loose file

loadBytes(loader.bytes)

Friday, April 19, 13

slide-53
SLIDE 53

Loading results

Dirty 0s 100s 200s 300s 400s Default Cache Alias Cache/Alias

Friday, April 19, 13

slide-54
SLIDE 54

Wrap up: Old School still rocks

  • Separate simulation/rendering
  • Amortized memory allocation
  • Eschew strings
  • Off-line data processing

Friday, April 19, 13

slide-55
SLIDE 55
  • mailto: joe@insomniacgames.com
  • twitter: @jvalenzu

Friday, April 19, 13

slide-56
SLIDE 56

Bonus Material!

Friday, April 19, 13

slide-57
SLIDE 57

Defs Editor

Friday, April 19, 13

slide-58
SLIDE 58

Tools: WorldBuilder

Friday, April 19, 13

slide-59
SLIDE 59

Attack of the Clones

id: 688 name: Zombie Chomp type: Phantom level: 8 power: 270 ... energy: 10 id: 688 name: Zombie Chomp type: Phantom level: 8 power: 440 ... energy: 10 id: 688 name: Zombie Chomp type: flying level: 8 power: 440 ... energy: 10

Class Instance Override

Friday, April 19, 13

slide-60
SLIDE 60

Attack of the Clones “Solution”

private function getNumberKey(key:String):Number { if (overrides.hasOwnProperty(key)) return overrides[key]; return abilityTagClass[key]; } private function setNumberKey(key:String, value:Number):void {

  • verrides[key] = abilityTagClass[key];

} public function set accuracy(value:Number):void { setNumberKey("accuracy", MathUtils.clamp(value, 0, 1)); }

Friday, April 19, 13

slide-61
SLIDE 61
  • flash.sampler API
  • Interactive/offline tool
  • HTML/WebSocket with daemon
  • JSON output

Don’t Panic!

Friday, April 19, 13

slide-62
SLIDE 62
  • MonetDB
  • 300e6 rows
  • abstract

schema: 16 ints

  • Stat browsing

Stats

Friday, April 19, 13

slide-63
SLIDE 63

Friday, April 19, 13

slide-64
SLIDE 64

Vendor tools & Middleware

  • Flash (Flex 4.6), Player Target 10
  • PHP, AWS, Cloudfront (CDN - Content Delivery

Network), Rightscale, dbShards.

  • FDT, Flash Develop, fdb+emacs, Flash,

Chrome.

Friday, April 19, 13

slide-65
SLIDE 65

Cache Control

  • Unique asset URLs
  • assets/avatars/fiora_brother_sam_1342053170.swf
  • Explicit versions
  • Bust on I/O error

<avatar> <id>23</id> <name>Lunakin_Fiora_Brother</name> <filename> <filename>fiora_brother_sam</filename> <ver>1342053170</ver> <anim>idle</anim> </filename> </avatar>

Friday, April 19, 13

slide-66
SLIDE 66

Live Flow

Dev QA Live devel hotfix weekly_update Branches Environments

Friday, April 19, 13

slide-67
SLIDE 67

Live Flow

Dev QA Live devel hotfix weekly_update Branches Environments

Friday, April 19, 13

slide-68
SLIDE 68

Live Flow

Dev QA Live devel hotfix weekly_update Branches Environments Snapshot client (flash) branched server (php)

Friday, April 19, 13

slide-69
SLIDE 69

Live Flow

Dev QA Live devel hotfix weekly_update Branches Environments Snapshot client (flash) branched server (php)

Friday, April 19, 13

slide-70
SLIDE 70

Live Flow

Dev QA Live devel hotfix weekly_update Branches Environments Snapshot client (flash) branched server (php)

Friday, April 19, 13