Skip to content

Conversation

rubennorte
Copy link
Contributor

@rubennorte rubennorte commented Sep 10, 2025

Initial docs for the new Web Performance APIs in Canary.

Copy link

netlify bot commented Sep 10, 2025

Deploy Preview for react-native ready!

Name Link
🔨 Latest commit 091fb37
🔍 Latest deploy log https://app.netlify.com/projects/react-native/deploys/68e4480c65ca930008b6489f
😎 Deploy Preview https://deploy-preview-4792--react-native.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@rubennorte rubennorte marked this pull request as ready for review October 2, 2025 15:05
@@ -0,0 +1,10 @@
---
id: global-EventCounts
title: EventCounts 🧪
Copy link
Collaborator

@Simek Simek Oct 2, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested the addition on PR preview, everything looks good! 👍

Just wonder if we should place the emoji before the sidebar/page title to match arrangement of already existing pages like "InteractionManager" or "DEV"?

I also looked if we can do something about not the greatest sidebar wrapping for few entries:

Screenshot 2025-10-02 201326

It's nothing blocking, but did not found any easy solution for that changing few styles in the DevTools, so it's just a note for me, for later.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just wonder if we should place the emoji before the sidebar/page title to match arrangement of already existing pages like "InteractionManager" or "DEV"?

I followed the same convention we have on react.dev, and it's also used by MDN. I can change the other cases to align with this instead.

@rubennorte rubennorte requested a review from cipolleschi October 6, 2025 18:02
Copy link
Contributor

@cipolleschi cipolleschi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mostly good for me! I left a couple of comments to improve consistency and a double check on other details.

:::tip Canary 🧪

**This API is currently only available in React Native’s Canary and Experimental channels.**

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the experimental message has more details than the canary one. I'd suggest that we either provide details for both or none.


---

# Reference
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why this is the only class with Reference and a more detailed documentation than just a link to the Web specification one?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because it has additional methods that are RN-specific.


See [documentation in MDN](https://developer.mozilla.org/en-US/docs/Web/API/Performance/memory).

### `rnStartupTiming` ⚠️
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
### `rnStartupTiming` ⚠️
### `rnStartupTiming`

There is a warning block below, we can avoid the emoji here, imho.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is aligned with how MDN defines the docs. For non-standard methods, the warning is always shown next to the method name.


| Name | Type | Description |
| ---------------------------------------- | -------------- | --------------------------------------------------------- |
| `startTime` | number \| void | When the application startup was started. |
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this might need a bit of more information. In a greenfield react native app, does it takes into account the native startup time?
What does it mean for a brownfield application, where React Native might be initialized only when the user navigate to a specific tab or screen?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, I checked and in OSS this is always the time of RN runtime initialization. I fixed that.

### `timeOrigin`

:::warning Partial support
Provides the number of milliseconds from the UNIX epoch until system boot, instead of the number of milliseconds from the UNIX epoch until app startup.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"until system boot" or "since system boot"? Isn't the system boot the starting point (the 0)?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"until system boot". Since system boot is just performance.now().

@rubennorte rubennorte merged commit 328332a into facebook:main Oct 6, 2025
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants