New scene graph model

[wcandillon]

This is a new model where use a Picture recorder that supports animation values.
Consider the following deeply nested tree:

<Image x={0} y={0} width={width} height={height} image={oslo} fit="cover">
  <ColorMatrix matrix={matrix} />
  <LinearToSRGBGamma>
    <Lerp t={t}>
      <ColorMatrix matrix={purple} />
      <ColorMatrix matrix={blackAndWhite} />
    </Lerp>
  </LinearToSRGBGamma>
</Image>

This will generate the following instruction set:

[
  { type: 'SaveCTM', props: { transform: [Array] } },
  { type: 'SavePaint', props: {} },
  {
    type: 'PushColorFilter',
    colorFilterType: 'skMatrixColorFilter',
    props: { matrix: [Array] }
  },
  {
    type: 'PushColorFilter',
    colorFilterType: 'skMatrixColorFilter',
    props: { matrix: [Array] }
  },
  {
    type: 'PushColorFilter',
    colorFilterType: 'skMatrixColorFilter',
    props: { matrix: [Array] }
  },
  {
    type: 'PushColorFilter',
    colorFilterType: 'skLerpColorFilter',
    props: { t: 0.5 }
  },
  {
    type: 'PushColorFilter',
    colorFilterType: 'skLinearToSRGBGammaColorFilter',
    props: {}
  },
  { type: 'ComposeColorFilter' },
  { type: 'MaterializePaint' },
  {
    type: 'DrawImage',
    props: {
      x: 0,
      y: 0,
      width: 256,
      height: 256,
      image: [JsiSkImage],
      fit: 'cover'
    }
  },
  { type: 'RestorePaint' },
  { type: 'RestoreCTM' }
]