perf: indirection

packages/color/src/traits/colorized.js

@@ -27,15 +27,6 @@ export default (flecks) => {
       this.$$hsv = [0, 0, 0];
     }
 
-    get blue() {
-      return this.state.blue;
-    }
-
-    set blue(blue) {
-      super.blue = blue;
-      this.$$rgbChanged = true;
-    }
-
     static defaultState() {
       return {
         red: 0,
@@ -44,13 +35,10 @@ export default (flecks) => {
       };
     }
 
-    get green() {
-      return this.state.green;
-    }
-
-    set green(green) {
-      super.green = green;
-      this.$$rgbChanged = true;
+    destroy() {
+      this.entity.off('redChanged', this.onRgbChanged);
+      this.entity.off('greenChanged', this.onRgbChanged);
+      this.entity.off('blueChanged', this.onRgbChanged);
     }
 
     get hue() {
@@ -64,15 +52,13 @@ export default (flecks) => {
 
     async load(json) {
       await super.load(json);
+      this.entity.on('redChanged', this.onRgbChanged, this);
+      this.entity.on('greenChanged', this.onRgbChanged, this);
+      this.entity.on('blueChanged', this.onRgbChanged, this);
       this.$$hsv = rgb2hsv([this.state.red, this.state.green, this.state.blue]);
     }
 
-    get red() {
-      return this.state.red;
-    }
-
-    set red(red) {
-      super.red = red;
+    onRgbChanged() {
       this.$$rgbChanged = true;
     }