1.4x slower than Safari on the "jsx" function in React
Categories
(Core :: JavaScript Engine, enhancement, P2)
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
};
}
Updated•1 year ago
|
Updated•1 year ago
|
Comment 1•1 year ago
|
||
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.
Comment 2•1 year ago
|
||
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.
Comment 3•1 year ago
|
||
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'
Description
•