Angular, Beyond the DOM

by Austin McDaniel

About Me...

Austin McDaniel

Chief Architect At Swimlane

Github: @amcdnl

Twitter: @amcdnl

One framework to rule them all!

What are we doing today?

• Web
• Mobile Native
• Desktop Native
• Server-side

We've come a long way...

The next evolution...

Taming the wild west of VR/AR...

View Code

Different Story,

same challenges...

• Interaction Events: Click, Keyboard, Touch
• View port Events: Window resize
• Life cycle hooks: init, render, destroy
• Animations
• Dataflow

And even more

new challenges...

• Desktop / Mobile VR
• Head Tracking
• Gestures
• Voice Recognition for Input
• Shaders (C)

Light at the end of the tunnel...

<a-scene>
  <a-entity
    sound="src: url(sound.mp3)"
    sound__beep="src: url(beep.mp3)"
    sound__boop="src: url(boop.mp3)"
  ></a-entity>
</a-scene>

Wait, is that Angular?What if it could be?

Enter custom renderers!

<ngx-renderer>
  <ngx-orbit-controls></ngx-orbit-controls>
  <ngx-scene>
    <ngx-perspective-camera></ngx-perspective-camera>
    <ngx-point-light></ngx-point-light>
    <ngx-sphere
      *ngFor="let ball of balls"
      [positionY]="ball * 5"
      [positionX]="ball * 5"
      [positionZ]="0">
    </ngx-sphere>
  </ngx-scene>
</ngx-renderer>

Steroscopy is the magic behind VR

Steroscopy dates back to 1838 which predates photography!

Simple, just apply a filter to your webgl!

Demo!

What's next?

• Better in-memory rendering?

• VR First?

• Native Compilation?