Content-Length: 345708 | pFad | http://github.com/facebook/react-native/pull/48922

F8 Implement CustomEvent by rubennorte · Pull Request #48922 · facebook/react-native · GitHub
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement CustomEvent #48922

Open
wants to merge 9 commits into
base: main
Choose a base branch
from
Open

Conversation

rubennorte
Copy link
Contributor

Summary:
Changelog: [internal]

This is a basic subclass of Event that allows setting custom values (as opposed to Event that is meant to be used as a superclass).

Differential Revision: D67804060

@facebook-github-bot facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. p: Facebook Partner: Facebook Partner labels Jan 24, 2025
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D67804060

rubennorte added a commit to rubennorte/react-native that referenced this pull request Jan 24, 2025
Summary:

Changelog: [internal]

This is a basic subclass of Event that allows setting custom values (as opposed to `Event` that is meant to be used as a superclass).

Differential Revision: D67804060
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D67804060

Summary:

Changelog: [internal]

This implements a (mostly) spec-compliant version of the [`Event`](https://dom.spec.whatwg.org/#interface-event) and [`EventTarget`](https://dom.spec.whatwg.org/#interface-eventtarget) Web interfaces.

It does not implement legacy methods in either of the interfaces, and ignores the parts of the spec that are related to Web-specific quirks (shadow roots, re-mapping of animation events with webkit prefixes, etc.).

IMPORTANT: This only creates the interfaces and does not expose them externally yet (no `Event` or `EventTarget` in the global scope).

Reviewed By: yungsters

Differential Revision: D67738145
Summary:

Changelog: [internal]

Creates a benchmarks to measure the performance of `EventTarget`.

Reviewed By: javache

Differential Revision: D67750677
Summary:

Changelog: [internal]

Adds a regression test to make sure we implement the correct spec-compliant behavior for a possible bug in ~~the Web spec~~ __Chrome__: whatwg/dom#1346

Edit: the bug is in the Chrome implementation, not in the spec.

Reviewed By: javache

Differential Revision: D67758702
…n of ReadOnlyNode (facebook#48427)

Summary:

Changelog: [internal]

The `ReactNativeElement` class was refactored for performance reasons, and the current implementation does **NOT** call `super()`, and it inlines the parent constructor instead.

When it eventually extends `EventTarget`, things won't work as expected because the existing `EventTarget` implementation has constructor dependencies.

This refactors the current implementation of `EventTarget` to eliminate those constructor side-effects, and eliminates the constructor altogether. 

This breaks encapsulation, but it has some positive side-effects on performance:
1. Creating `EventTarget` instances is faster because it has no constructor logic.
2. Improves memory by not creating maps to hold the event listeners if no event listeners are ever added to the target (which is very common).
3. Improves the overall runtime performance of the methods in the class by migrating away from private methods (which are known to be slow on the babel transpiled version we're currently using).

Extra: it also simplifies making window/the global scope implement the EventTarget interface :) 

## Benchmark results

Before:

| Latency average (ns) | Latency median (ns) | Samples | Task name                                              | Throughput average (ops/s) | Throughput median (ops/s) |
| ---|--- |--- |--- |---|---|
| 8234.22 ± 0.27%      | 8132.00             | 121445  | dispatchEvent, no bubbling, no listeners               | 122323 ± 0.02%             | 122971                   |
| 9001.22 ± 0.41%      | 8883.00             | 111097  | dispatchEvent, no bubbling, single listener            | 111981 ± 0.02%             | 112575                   |
| 51777.94 ± 0.58%     | 51247.00            | 19314   | dispatchEvent, no bubbling, multiple listeners         | 19393 ± 0.04%              | 19513                    |
| 8256.65 ± 0.29%      | 8152.00             | 121115  | dispatchEvent, bubbling, no listeners                  | 122031 ± 0.02%             | 122669                   |
| 9064.32 ± 0.44%      | 8933.00             | 110323  | dispatchEvent, bubbling, single listener per target    | 111265 ± 0.02%             | 111944                   |
| 51879.66 ± 0.27%     | 51447.00            | 19276   | dispatchEvent, bubbling, multiple listeners per target | 19325 ± 0.04%              | 19437               |

After:

| Latency average (ns) | Latency median (ns) | Samples | Task name                                              | Throughput average (ops/s) | Throughput median (ops/s)|
| ---------------------|---------------------|---------|--------------------------------------------------------|----------------------------|--------------------------|
| 5664.62 ± 0.50%      | 5588.00             | 176535  | dispatchEvent, no bubbling, no listeners               | 178219 ± 0.02%             | 178955                   |
| 7232.86 ± 0.50%      | 7131.00             | 138258  | dispatchEvent, no bubbling, single listener            | 139540 ± 0.02%             | 140233                   |
| 50957.51 ± 0.71%     | 50336.00            | 19625   | dispatchEvent, no bubbling, multiple listeners         | 19751 ± 0.04%              | 19866                    |
| 5692.36 ± 0.50%      | 5618.00             | 175675  | dispatchEvent, bubbling, no listeners                  | 177315 ± 0.02%             | 177999                   |
| 7277.82 ± 0.38%      | 7181.00             | 137404  | dispatchEvent, bubbling, single listener per target    | 138560 ± 0.02%             | 139256                   |
| 50493.64 ± 0.28%     | 50105.00            | 19805   | dispatchEvent, bubbling, multiple listeners per target | 19855 ± 0.04%              | 19958                    |

Reviewed By: yungsters

Differential Revision: D67758408
Summary:

Changelog: [internal]

This improves the performance of DOM `Event` interface implementation by migrating away from private fields.

Reviewed By: yungsters

Differential Revision: D67751821
Summary:

Changelog: [internal]

Makes the constants read-only and accessible through `Event.prototype` as well.

Reviewed By: yungsters

Differential Revision: D67830012
…uting the global scope

Differential Revision: D68672215
…48920)

Summary:

Changelog: [internal]

Implements a module with helpers to define event handler IDL attributes in classes extending `EventTarget`. E.g.:

```
import {getEventHandlerAttribute, setEventHandlerAttribute} from '../path/to/EventHandlerAttributes';

class EventTargetSubclass extends EventTarget {
  get oncustomevent(): EventListener | null {
    return getEventHandlerAttribute(this, 'customEvent');
  }
  set oncustomevent(listener: EventListener | null) {
    setEventHandlerAttribute(this, 'customEvent', listener);
  }
}

const eventTargetInstance = new EventTargetSubclass();

eventTargetInstance.oncustomevent = (event: Event) => {
  console.log('custom event received');
};
eventTargetInstance.dispatchEvent(new Event('customEvent'));
// Logs 'custom event received' to the console.

eventTargetInstance.oncustomevent = null;
eventTargetInstance.dispatchEvent(new Event('customEvent'));
// Does not log anything to the console.

```

Differential Revision: D67839560
Summary:

Changelog: [internal]

This is a basic subclass of Event that allows setting custom values (as opposed to `Event` that is meant to be used as a superclass).

Reviewed By: yungsters

Differential Revision: D67804060
rubennorte added a commit to rubennorte/react-native that referenced this pull request Jan 25, 2025
Summary:

Changelog: [internal]

This is a basic subclass of Event that allows setting custom values (as opposed to `Event` that is meant to be used as a superclass).

Reviewed By: yungsters

Differential Revision: D67804060
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D67804060

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. fb-exported p: Facebook Partner: Facebook Partner
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: http://github.com/facebook/react-native/pull/48922

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy