Pick only the keys you need

An endpoint returns a user object with forty fields. Your avatar component needs three. Passing the whole thing wastes memory in React state and makes every re-render comparison slower than it should be.

Implement pick(source, keys). source is a plain object and keys is an array of property names. Return a new object holding only those keys that are own properties of source, with the same values. A requested key that source does not have is skipped entirely — it must not appear in the result at all. The result's keys appear in the order given in the keys array, not the order they sit in source. An empty keys array returns an empty object. Never modify source.

pick({ a: 1, b: 2, c: 3 }, ["a", "c"]);
// { a: 1, c: 3 }

pick({ a: 1 }, ["a", "missing"]);
// { a: 1 } — the absent key is skipped, not set to undefined

Object.keys(pick({ a: 1, b: 2 }, ["b", "a"]));
// ["b", "a"] — the result follows the keys array's order