Static-optimize `on` event listener object

[nolanlawson]

Consider how components with event listeners are compiled.

Input:

<button
  onclick={onClick}
  ontouchstart={onTouchStart}
  onpointerdown={onPointerDown}
></button>

Output:

  // ...
  const {_m0, _m1, _m2, _m3, _m4, _m5} = $ctx;
  // ...
  return [api_static_fragment($fragment1, 1, [api_static_part(0, {
    on: {
      "click": _m3 || ($ctx._m3 = api_bind($cmp.onClick)),
      "touchstart": _m4 || ($ctx._m4 = api_bind($cmp.onTouchStart)),
      "pointerdown": _m5 || ($ctx._m5 = api_bind($cmp.onPointerDown))
    }
  }, null)])];

... You can notice that we cache the individual listeners (onClick, etc.) on the $ctx object, because the listeners never change after the component is mounted. However, it's kind of excessive to cache them all individually, when we can cache the entire on object instead.

This should have some small perf benefit since we aren't re-creating the on object over and over again, and because we are doing one cache lookup instead of multiple.

[git2gus[bot]]

This issue has been linked to a new work item: W-16535749

[ujjwalshriv3]

Thanks for useful information