upd

Author: mattqual

src/SUMMARY.md

@@ -11,6 +11,7 @@
   - [E4X](./overview/e4x.md)
   - [Whack DS](./overview/whack_ds.md)
     - [MXML like constructs](./overview/whack_ds/mxml_like.md)
+    - [The good, the bad](./overview/whack_ds/good_bad.md)
   - [Tooling](./overview/tooling.md)
   - [Namespaces](./overview/namespaces.md)
   - [Event model](./overview/event-model.md)

src/overview/whack_ds.md

@@ -102,33 +102,7 @@ Even though the constructor is frequently re-evaluated, objects originating from
 
 ## Immutability
 
-Because of possible inconsistencies when reading or comparing States, Contexts and Props, which may also affect `<fx:Style>` elements, it is best to treat those as immutable (e.g. not to overwrite any field or element of a Prop, Context or State). Overwriting a field or element of such a thing involves rather overwriting the whole thing, such as:
-
-```sx
-[State]
-var x : [double] = [];
-
-// Somewhere
-
-x = [...x, 10] // pushes 10
-               //   never .push(10)
-```
-
-In the same component, you may also define deriveds, like:
-
-```sx
-public function add(n:double):void {
-    x = [...x, n]
-}
-```
-
-Then you can do:
-
-```sx
-add(10)
-```
-
-Anywhere in the component, although this is an insignificant example of how deriveds can be used.
+Ensure you follow immutability principles with States, Contexts and Props.
 
 > **Note**: ReactJS and Adobe Flex also present the same limitation.
 >

src/overview/whack_ds/good_bad.md

@@ -0,0 +1,50 @@
+# The good, the bad
+
+## :( Mutability
+
+```sx
+[State]
+var x : [uint] = [];
+
+x.push(10); // BAD
+```
+
+## :) Mutability
+
+```sx
+[State]
+var x : [uint] = [];
+
+x = [...x, 10] // GOOD
+```
+
+<sup>You can also implement deriveds.</sup>
+
+## :&#x28; Callbacks
+
+```sx
+final = (
+    <cset:Evaluator
+        functions={[ function():uint(10)
+                   , function():uint (0) ]}/>
+)       // BAD
+```
+
+<sup>Callback caching (`whack.ds.useCallback`) only occurs implicitly for Functions assigned to the whole attribute.</sup>
+
+## :&#x28; Callbacks
+
+```sx
+final = (
+    <cset:Evaluator>
+        <cset:functions>
+            {[
+                function():uint (10), // BAD
+                function():uint  (0), // BAD
+            ]}
+        </cset:functions>
+    </cset:Evaluator>
+)
+```
+
+<sup>Callback caching (`whack.ds.useCallback`) only occurs implicitly for Functions assigned to the whole attribute.</sup>