Open Bug 1845840 Opened 1 year ago Updated 1 year ago

1.4x slower than Safari on the "jsx" function in React

Categories

(Core :: JavaScript Engine, enhancement, P2)

enhancement

Tracking

()

People

(Reporter: mstange, Unassigned)

References

(Blocks 2 open bugs)

Details

(Whiteboard: [sp3])

On the TodoMVC-React subtest, there's a function called jsx. Safari is 1.4x faster than Firefox on this function (Chrome is slower).

Matching Safari's performance on this function would improve this subtest by 1.2%.

Firefox: https://share.firefox.dev/3Ye5dqU 1892 samples
Chrome: https://share.firefox.dev/454tVfu 2340 samples
Safari: https://share.firefox.dev/3YeTgBg 1340 samples

function jsx(type, config, maybeKey) {
  var propName,
    props = {},
    key = null,
    ref = null;
  void 0 !== maybeKey && (key = "" + maybeKey);
  void 0 !== config.key && (key = "" + config.key);
  void 0 !== config.ref && (ref = config.ref);
  for (propName in config) hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName) && (props[propName] = config[propName]);
  if (type && type.defaultProps) for (propName in config = type.defaultProps, config) void 0 === props[propName] && (props[propName] = config[propName]);
  return {
    $$typeof: REACT_ELEMENT_TYPE,
    type: type,
    key: key,
    ref: ref,
    props: props,
    _owner: ReactCurrentOwner.current
  };
}

Source code: https://github.com/mozilla/Speedometer/blob/0892f60b98278007156d8cab7d5c7d956725d6e6//resources/todomvc/architecture-examples/react/dist/app.bundle.js#L6822-L6840

Severity: -- → N/A
Type: task → enhancement
Priority: -- → P2

Next Steps, learning my lesson from the shallowEquals debacle:

  • Would be worthwhile to inspect the set of arguments this is actually called with
  • From there we could build a microbenchmark to use for investigation

This seems to be entirely in Ion code, so getting an IONPERF=ir profile would probably be a valuable thing to see.

So here's an IONPERF=ir profile gathered locally (mercurial revision a6c91cd0d909, benchmark revision 0892f60b98278007; but with a loop added around the benchmark function to lengthen execution)

The three highest contributors by cost in the Ion perf profile:

  • MegamorphicSetElement - 78 ticks, 68 ticks self
  • OOL code - 45 ticks
  • MegamorphicHasProp - 45 ticks, 42 self.

Looking into arguments, jsx is extremely polymorphic;

For the type argument we see strings, symbols, functions and objects
For the config argument, we see objects, but with diverse key sets.
For the maybeKey argument, mostly we see undefined, but some randomly generated strings like 'xxAO97GBGE9nMIKpeEoRQ'

You need to log in before you can comment on or make changes to this bug.