Skip to content

Commit 9715993

Browse files
NickGerlemanfacebook-github-bot
authored andcommitted
Ship VirtualizedList_EXPERIMENTAL
Summary: `VirtualizedList_EXPERIMENTAL` is a fork of VirtualizedList. It was originally created for the purpose of keyboard/a11y fixes, which required the list to allow rendering discontiguous regions of cells. So, the large part of the refactor is in the data structure used to represent state (now a sparse bitmask), and building out the render function to operate off the bitmask. This structure allows pre-rendering areas where we know focus must be able to be synchronously be moved to. This is exercised on platforms like Windows and macOS which fire view level focus events. The new implementation otherwise aims to preserve near-exact list behavior as previously. Apart from the structure change, the refactor has made the code (subjectively) a lot easier to reason about, and there are now stronger internal invariants than before. The bitmask structure also enables new approaches for nested list stability, and implementing OffScreen. **Why ship it now?** Having two implementations has multiple times prevented other changes to VirtualizedList, so it is incurring a constant engineer cost. At this point, we have a lot of reason to be confident in the maturity of the new list implementation (see the test plan below). So, reconciling the implementations not only unlocks the enhancements of the new list, but unblocks future changes to VirtualizedList. ## Test Plan 1. **Unit tests:** A few dozen unit tests were added to VirtualizedList, validating the regions it renders in response to injected input, across its API surface. Both VirtualizedList implementations must pass the same tests, around expected behavior. 2. **RNTester:** Scenarios in RNTester were manually validated, and all worked as before 3. **New invariants:** I added a lot of internal logic checks and bounds checks as invariant violations, to try to produce signal if any part of the refactor went unexpected in the wild. 4. **MSFT Rollout:** I rolled out the changes as a fork of VirtualizedList at MSFT to a couple of high-usage surfaces using Android, iOS, and Windows on Paper. Some invariant violations were surfaced and fixed, but telemetry showed solid system and scenario health with the change. 5. **Meta import:** Fixed all land-blocking test failures when using the new list. These were confined to updating snapshots, and adding additional checks for invalid input. 6. **Panel apps:** Manually validated top-level surfaces of panel apps in debug/release modes. Fixed a couple of invariant violations and novel usages. Profiled new JS structures against an expensive list with Hermes profiler. 7. **Facebook App Rollout:** After some manual validation of top-level surfaces, the change was rolled out to Facebook for Android and iOS as an experiment. New invariant violations were fixed, and the change has sat in production for several weeks at this point, while measuring impact to metrics like error rate, responsiveness, and impressions. This is the first introduction to all of OSS, and some Meta internal apps. This means there may still be novel usages of VirtualizedList that were not picked up during testing, but I think there has been enough diligence to roll out what has been tested, and forward fix anything unexpected that might still come up. Changelog: [General][Changed] - Ship VirtualizedList_EXPERIMENTAL Reviewed By: javache Differential Revision: D40259791 fbshipit-source-id: 63eee9381d197a1e38ae663b2158436ff135c0e1
1 parent dcd2114 commit 9715993

15 files changed

+1984
-8673
lines changed

Libraries/Lists/FlatList.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,14 @@ import type {
1717
import type {RenderItemProps, RenderItemType} from './VirtualizedList';
1818

1919
import {type ScrollResponderType} from '../Components/ScrollView/ScrollView';
20+
import VirtualizedList from './VirtualizedList';
2021
import {keyExtractor as defaultKeyExtractor} from './VirtualizeUtils';
2122
import memoizeOne from 'memoize-one';
2223

2324
const View = require('../Components/View/View');
2425
const StyleSheet = require('../StyleSheet/StyleSheet');
2526
const deepDiffer = require('../Utilities/differ/deepDiffer');
2627
const Platform = require('../Utilities/Platform');
27-
const VirtualizedList = require('./VirtualizedList');
2828
const invariant = require('invariant');
2929
const React = require('react');
3030

Libraries/Lists/FlatList.js.flow

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@
1010

1111
const React = require('react');
1212
const View = require('../Components/View/View');
13-
const VirtualizedList = require('./VirtualizedList');
1413

1514
import typeof ScrollViewNativeComponent from '../Components/ScrollView/ScrollViewNativeComponent';
1615
import {type ScrollResponderType} from '../Components/ScrollView/ScrollView';
@@ -20,6 +19,7 @@ import type {
2019
ViewabilityConfigCallbackPair,
2120
} from './ViewabilityHelper';
2221
import type {RenderItemType, RenderItemProps} from './VirtualizedList';
22+
import typeof VirtualizedList from './VirtualizedList';
2323

2424
type RequiredProps<ItemT> = {|
2525
/**
@@ -61,7 +61,7 @@ type FlatListProps<ItemT> = {|
6161
...OptionalProps<ItemT>,
6262
|};
6363

64-
type VirtualizedListProps = React.ElementConfig<typeof VirtualizedList>;
64+
type VirtualizedListProps = React.ElementConfig<VirtualizedList>;
6565

6666
export type Props<ItemT> = {
6767
...$Diff<

0 commit comments

Comments
 (0)