mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Rubén Norte
a94bbfbe0e
Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/37863 This creates 2 examples for IntersectionObserver in RNTester: * The first example is just a copy of the example provided by MDN in the documentation page for `IntersectionObserver` (https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API). This example is useful to show how React Native behaves the same way with the same code. * The second example is a "stress test" for the API: a screen with 500 simultaneous node being observed at the same time with different observers. As we compute the intersections after scroll (after "mounting" the state update with the updated scroll position) in the main thread, this highlights a possible impact on scroll performance. IntersectionObserver isn't yet enabled by default, so no need to add a changelog entry about this. We'll add one when the API becomes generally available. Changelog: [Internal] Reviewed By: rshest Differential Revision: D45736845 fbshipit-source-id: 40b6bce39f90e04653504b1033a4edfaa65e93ca
26 lines
883 B
JavaScript
26 lines
883 B
JavaScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @flow strict-local
|
|
* @format
|
|
*/
|
|
|
|
import * as IntersectionObserverMDNExample from './IntersectionObserverMDNExample';
|
|
import * as IntersectionObserverBenchmark from './IntersectionObserverBenchmark';
|
|
|
|
export const framework = 'React';
|
|
export const title = 'IntersectionObserver';
|
|
export const category = 'UI';
|
|
export const documentationURL =
|
|
'https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API';
|
|
export const description =
|
|
'API to detect paint times for elements and changes in their intersections with other elements.';
|
|
export const showIndividualExamples = true;
|
|
export const examples = [
|
|
IntersectionObserverMDNExample,
|
|
IntersectionObserverBenchmark,
|
|
];
|