[new feature] props rest syntax

[roman01la]

Props transferring via rest and spread syntax

(spread syntax was already merged)

One thing that is sometimes useful in React/JavaScript, but doesn't exist in Clojure, is object spread and rest syntax for Clojure maps (see object spread in JS). It's often used for props transferring, to extract a subset of props and pass the rest to underlying components.

function Button({ style, ...props }) {
  return (
    <div style={style}>
      <MaterialButton {...props} />
    </div>
  );
}

In Clojure, you'd have to dissoc keys manually, which is more verbose and can be frustrating for folks coming from JavaScript.

(defui button [{:keys [style] :as props}]
  ($ :div {:style style}
    ($ MaterialButton
      (merge {:theme "light"}
             (dissoc props :style)))))

For this specific reason, UIx adds syntactic sugar in defui and $ macros to support the pattern.

(defui button [{:keys [style] props :&}]
  ($ :div {:style style}
    ($ MaterialButton {:theme "light" :& props})))

Props rest syntax

When destructing props in uix.core/defui or uix.core/fn all keys that are not mentioned in destructing form will be stored in a map assigned to :& keyword. The syntax is composable with all other means of destructuring maps in Clojure, except that :& exists only at top level, it won't work for nested maps.

[accounts-pitch-io]

master:
react x 11806 ops/s, elapsed 847ms
uix x 9217 ops/s, elapsed 1085ms
helix x 8598 ops/s, elapsed 1163ms
reagent x 6203 ops/s, elapsed 1612ms

PR:
react x 12063 ops/s, elapsed 829ms
uix x 9416 ops/s, elapsed 1062ms
helix x 8929 ops/s, elapsed 1120ms
reagent x 5855 ops/s, elapsed 1708ms

[accounts-pitch-io]

master:
react x 10277 ops/s, elapsed 973ms
uix x 7868 ops/s, elapsed 1271ms
helix x 7273 ops/s, elapsed 1375ms
reagent x 5456 ops/s, elapsed 1833ms

PR:
react x 11312 ops/s, elapsed 884ms
uix x 8163 ops/s, elapsed 1225ms
helix x 8230 ops/s, elapsed 1215ms
reagent x 5992 ops/s, elapsed 1669ms

[accounts-pitch-io]

master:
react x 10277 ops/s, elapsed 973ms
uix x 7868 ops/s, elapsed 1271ms
helix x 7273 ops/s, elapsed 1375ms
reagent x 5456 ops/s, elapsed 1833ms

PR:
react x 12453 ops/s, elapsed 803ms
uix x 9728 ops/s, elapsed 1028ms
helix x 8889 ops/s, elapsed 1125ms
reagent x 6588 ops/s, elapsed 1518ms

[accounts-pitch-io]

master:
react x 10277 ops/s, elapsed 973ms
uix x 7868 ops/s, elapsed 1271ms
helix x 7273 ops/s, elapsed 1375ms
reagent x 5456 ops/s, elapsed 1833ms

PR:
react x 10582 ops/s, elapsed 945ms
uix x 7541 ops/s, elapsed 1326ms
helix x 7205 ops/s, elapsed 1388ms
reagent x 5192 ops/s, elapsed 1926ms

[accounts-pitch-io]

master:
react x 10893 ops/s, elapsed 918ms
uix x 8889 ops/s, elapsed 1125ms
helix x 7342 ops/s, elapsed 1362ms
reagent x 4885 ops/s, elapsed 2047ms

PR:
react x 8382 ops/s, elapsed 1193ms
uix x 6431 ops/s, elapsed 1555ms
helix x 5754 ops/s, elapsed 1738ms
reagent x 3981 ops/s, elapsed 2512ms

[accounts-pitch-io]

master:
react x 9066 ops/s, elapsed 1103ms
uix x 6143 ops/s, elapsed 1628ms
helix x 5656 ops/s, elapsed 1768ms
reagent x 4773 ops/s, elapsed 2095ms

PR:
react x 10515 ops/s, elapsed 951ms
uix x 7380 ops/s, elapsed 1355ms
helix x 6536 ops/s, elapsed 1530ms
reagent x 4753 ops/s, elapsed 2104ms

[accounts-pitch-io]

master:
react x 9066 ops/s, elapsed 1103ms
uix x 6143 ops/s, elapsed 1628ms
helix x 5656 ops/s, elapsed 1768ms
reagent x 4773 ops/s, elapsed 2095ms

PR:
react x 8658 ops/s, elapsed 1155ms
uix x 6418 ops/s, elapsed 1558ms
helix x 5882 ops/s, elapsed 1700ms
reagent x 4537 ops/s, elapsed 2204ms