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.

Sign up for GitHub

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

Jump to bottom

More Transition lanes #20793

Merged
merged 1 commit into from
Feb 11, 2021
Merged

More Transition lanes #20793

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
64 changes: 37 additions & 27 deletions packages/react-reconciler/src/ReactFiberLane.new.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,38 +87,43 @@ export const SyncBatchedLane: Lane = /* */ 0b0000000000000000000
export const InputDiscreteHydrationLane: Lane = /* */ 0b0000000000000000000000000000100;
const InputDiscreteLane: Lanes = /* */ 0b0000000000000000000000000001000;

const InputContinuousHydrationLane: Lane = /* */ 0b0000000000000000000000000100000;
const InputContinuousLane: Lanes = /* */ 0b0000000000000000000000001000000;

export const DefaultHydrationLane: Lane = /* */ 0b0000000000000000000000100000000;
export const DefaultLane: Lanes = /* */ 0b0000000000000000000001000000000;

const TransitionHydrationLane: Lane = /* */ 0b0000000000000000001000000000000;
const TransitionLanes: Lanes = /* */ 0b0000000001111111110000000000000;
const TransitionLane1: Lane = /* */ 0b0000000000000000010000000000000;
const TransitionLane2: Lane = /* */ 0b0000000000000000100000000000000;
const TransitionLane3: Lane = /* */ 0b0000000000000001000000000000000;
const TransitionLane4: Lane = /* */ 0b0000000000000010000000000000000;
const TransitionLane5: Lane = /* */ 0b0000000000000100000000000000000;
const TransitionLane6: Lane = /* */ 0b0000000000001000000000000000000;
const TransitionLane7: Lane = /* */ 0b0000000000010000000000000000000;
const TransitionLane8: Lane = /* */ 0b0000000000100000000000000000000;
const TransitionLane9: Lane = /* */ 0b0000000001000000000000000000000;

const RetryLanes: Lanes = /* */ 0b0000011110000000000000000000000;
const RetryLane1: Lane = /* */ 0b0000000010000000000000000000000;
const RetryLane2: Lane = /* */ 0b0000000100000000000000000000000;
const RetryLane3: Lane = /* */ 0b0000001000000000000000000000000;
const RetryLane4: Lane = /* */ 0b0000010000000000000000000000000;
const InputContinuousHydrationLane: Lane = /* */ 0b0000000000000000000000000010000;
const InputContinuousLane: Lanes = /* */ 0b0000000000000000000000000100000;

export const DefaultHydrationLane: Lane = /* */ 0b0000000000000000000000001000000;
export const DefaultLane: Lanes = /* */ 0b0000000000000000000000010000000;

const TransitionLanes: Lanes = /* */ 0b0000000011111111111111100000000;
const TransitionHydrationLane: Lane = /* */ 0b0000000000000000000000100000000;
const TransitionLane1: Lane = /* */ 0b0000000000000000000001000000000;
const TransitionLane2: Lane = /* */ 0b0000000000000000000010000000000;
const TransitionLane3: Lane = /* */ 0b0000000000000000000100000000000;
const TransitionLane4: Lane = /* */ 0b0000000000000000001000000000000;
const TransitionLane5: Lane = /* */ 0b0000000000000000010000000000000;
const TransitionLane6: Lane = /* */ 0b0000000000000000100000000000000;
const TransitionLane7: Lane = /* */ 0b0000000000000001000000000000000;
const TransitionLane8: Lane = /* */ 0b0000000000000010000000000000000;
const TransitionLane9: Lane = /* */ 0b0000000000000100000000000000000;
const TransitionLane10: Lane = /* */ 0b0000000000001000000000000000000;
const TransitionLane11: Lane = /* */ 0b0000000000010000000000000000000;
const TransitionLane12: Lane = /* */ 0b0000000000100000000000000000000;
const TransitionLane13: Lane = /* */ 0b0000000001000000000000000000000;
const TransitionLane14: Lane = /* */ 0b0000000010000000000000000000000;

const RetryLanes: Lanes = /* */ 0b0000111100000000000000000000000;
const RetryLane1: Lane = /* */ 0b0000000100000000000000000000000;
const RetryLane2: Lane = /* */ 0b0000001000000000000000000000000;
const RetryLane3: Lane = /* */ 0b0000010000000000000000000000000;
const RetryLane4: Lane = /* */ 0b0000100000000000000000000000000;

export const SomeRetryLane: Lane = RetryLane1;

export const SelectiveHydrationLane: Lane = /* */ 0b0000100000000000000000000000000;
export const SelectiveHydrationLane: Lane = /* */ 0b0001000000000000000000000000000;
Copy link
Member

Choose a reason for hiding this comment

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

Is this supposed to be the same as RetryLane4?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

Check again. It was right all along.


const NonIdleLanes = /* */ 0b0000111111111111111111111111111;
const NonIdleLanes = /* */ 0b0001111111111111111111111111111;

export const IdleHydrationLane: Lane = /* */ 0b0001000000000000000000000000000;
const IdleLane: Lanes = /* */ 0b0010000000000000000000000000000;
export const IdleHydrationLane: Lane = /* */ 0b0010000000000000000000000000000;
const IdleLane: Lanes = /* */ 0b0100000000000000000000000000000;

export const OffscreenLane: Lane = /* */ 0b1000000000000000000000000000000;

Expand Down Expand Up @@ -179,6 +184,11 @@ function getHighestPriorityLanes(lanes: Lanes | Lane): Lanes {
case TransitionLane7:
case TransitionLane8:
case TransitionLane9:
case TransitionLane10:
case TransitionLane11:
case TransitionLane12:
case TransitionLane13:
case TransitionLane14:
return_highestLanePriority = TransitionPriority;
return lanes & TransitionLanes;
case RetryLane1:
Expand Down
64 changes: 37 additions & 27 deletions packages/react-reconciler/src/ReactFiberLane.old.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,38 +87,43 @@ export const SyncBatchedLane: Lane = /* */ 0b0000000000000000000
export const InputDiscreteHydrationLane: Lane = /* */ 0b0000000000000000000000000000100;
const InputDiscreteLane: Lanes = /* */ 0b0000000000000000000000000001000;

const InputContinuousHydrationLane: Lane = /* */ 0b0000000000000000000000000100000;
const InputContinuousLane: Lanes = /* */ 0b0000000000000000000000001000000;

export const DefaultHydrationLane: Lane = /* */ 0b0000000000000000000000100000000;
export const DefaultLane: Lanes = /* */ 0b0000000000000000000001000000000;

const TransitionHydrationLane: Lane = /* */ 0b0000000000000000001000000000000;
const TransitionLanes: Lanes = /* */ 0b0000000001111111110000000000000;
const TransitionLane1: Lane = /* */ 0b0000000000000000010000000000000;
const TransitionLane2: Lane = /* */ 0b0000000000000000100000000000000;
const TransitionLane3: Lane = /* */ 0b0000000000000001000000000000000;
const TransitionLane4: Lane = /* */ 0b0000000000000010000000000000000;
const TransitionLane5: Lane = /* */ 0b0000000000000100000000000000000;
const TransitionLane6: Lane = /* */ 0b0000000000001000000000000000000;
const TransitionLane7: Lane = /* */ 0b0000000000010000000000000000000;
const TransitionLane8: Lane = /* */ 0b0000000000100000000000000000000;
const TransitionLane9: Lane = /* */ 0b0000000001000000000000000000000;

const RetryLanes: Lanes = /* */ 0b0000011110000000000000000000000;
const RetryLane1: Lane = /* */ 0b0000000010000000000000000000000;
const RetryLane2: Lane = /* */ 0b0000000100000000000000000000000;
const RetryLane3: Lane = /* */ 0b0000001000000000000000000000000;
const RetryLane4: Lane = /* */ 0b0000010000000000000000000000000;
const InputContinuousHydrationLane: Lane = /* */ 0b0000000000000000000000000010000;
const InputContinuousLane: Lanes = /* */ 0b0000000000000000000000000100000;

export const DefaultHydrationLane: Lane = /* */ 0b0000000000000000000000001000000;
export const DefaultLane: Lanes = /* */ 0b0000000000000000000000010000000;

const TransitionLanes: Lanes = /* */ 0b0000000011111111111111100000000;
const TransitionHydrationLane: Lane = /* */ 0b0000000000000000000000100000000;
const TransitionLane1: Lane = /* */ 0b0000000000000000000001000000000;
const TransitionLane2: Lane = /* */ 0b0000000000000000000010000000000;
const TransitionLane3: Lane = /* */ 0b0000000000000000000100000000000;
const TransitionLane4: Lane = /* */ 0b0000000000000000001000000000000;
const TransitionLane5: Lane = /* */ 0b0000000000000000010000000000000;
const TransitionLane6: Lane = /* */ 0b0000000000000000100000000000000;
const TransitionLane7: Lane = /* */ 0b0000000000000001000000000000000;
const TransitionLane8: Lane = /* */ 0b0000000000000010000000000000000;
const TransitionLane9: Lane = /* */ 0b0000000000000100000000000000000;
const TransitionLane10: Lane = /* */ 0b0000000000001000000000000000000;
const TransitionLane11: Lane = /* */ 0b0000000000010000000000000000000;
const TransitionLane12: Lane = /* */ 0b0000000000100000000000000000000;
const TransitionLane13: Lane = /* */ 0b0000000001000000000000000000000;
const TransitionLane14: Lane = /* */ 0b0000000010000000000000000000000;

const RetryLanes: Lanes = /* */ 0b0000111100000000000000000000000;
const RetryLane1: Lane = /* */ 0b0000000100000000000000000000000;
const RetryLane2: Lane = /* */ 0b0000001000000000000000000000000;
const RetryLane3: Lane = /* */ 0b0000010000000000000000000000000;
const RetryLane4: Lane = /* */ 0b0000100000000000000000000000000;

export const SomeRetryLane: Lane = RetryLane1;

export const SelectiveHydrationLane: Lane = /* */ 0b0000100000000000000000000000000;
export const SelectiveHydrationLane: Lane = /* */ 0b0001000000000000000000000000000;

const NonIdleLanes = /* */ 0b0000111111111111111111111111111;
const NonIdleLanes = /* */ 0b0001111111111111111111111111111;

export const IdleHydrationLane: Lane = /* */ 0b0001000000000000000000000000000;
const IdleLane: Lanes = /* */ 0b0010000000000000000000000000000;
export const IdleHydrationLane: Lane = /* */ 0b0010000000000000000000000000000;
const IdleLane: Lanes = /* */ 0b0100000000000000000000000000000;

export const OffscreenLane: Lane = /* */ 0b1000000000000000000000000000000;

Expand Down Expand Up @@ -179,6 +184,11 @@ function getHighestPriorityLanes(lanes: Lanes | Lane): Lanes {
case TransitionLane7:
case TransitionLane8:
case TransitionLane9:
case TransitionLane10:
case TransitionLane11:
case TransitionLane12:
case TransitionLane13:
case TransitionLane14:
return_highestLanePriority = TransitionPriority;
return lanes & TransitionLanes;
case RetryLane1:
Expand Down
61 changes: 32 additions & 29 deletions packages/react-reconciler/src/__tests__/DebugTracing-test.internal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,9 @@ describe('DebugTracing', () => {

let logs;

const DEFAULT_LANE_STRING = '0b0000000000000000000000010000000';
const RETRY_LANE_STRING = '0b0000000100000000000000000000000';

beforeEach(() => {
jest.resetModules();

Expand Down Expand Up @@ -129,9 +132,9 @@ describe('DebugTracing', () => {
expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ render (0b0000000010000000000000000000000)',
`group: ⚛️ render (${RETRY_LANE_STRING})`,
'log: <Example/>',
'groupEnd: ⚛️ render (0b0000000010000000000000000000000)',
`groupEnd: ⚛️ render (${RETRY_LANE_STRING})`,
]);
});

Expand All @@ -158,9 +161,9 @@ describe('DebugTracing', () => {
expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ render (0b0000000000000000000001000000000)',
`group: ⚛️ render (${DEFAULT_LANE_STRING})`,
'log: ⚛️ Example suspended',
'groupEnd: ⚛️ render (0b0000000000000000000001000000000)',
`groupEnd: ⚛️ render (${DEFAULT_LANE_STRING})`,
]);

logs.splice(0);
Expand Down Expand Up @@ -199,19 +202,19 @@ describe('DebugTracing', () => {
expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ render (0b0000000000000000000001000000000)',
`group: ⚛️ render (${DEFAULT_LANE_STRING})`,
'log: <Wrapper/>',
'groupEnd: ⚛️ render (0b0000000000000000000001000000000)',
`groupEnd: ⚛️ render (${DEFAULT_LANE_STRING})`,
]);

logs.splice(0);

expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ render (0b0000000010000000000000000000000)',
`group: ⚛️ render (${RETRY_LANE_STRING})`,
'log: <Example/>',
'groupEnd: ⚛️ render (0b0000000010000000000000000000000)',
`groupEnd: ⚛️ render (${RETRY_LANE_STRING})`,
]);
});

Expand Down Expand Up @@ -241,11 +244,11 @@ describe('DebugTracing', () => {
expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ commit (0b0000000000000000000001000000000)',
'group: ⚛️ layout effects (0b0000000000000000000001000000000)',
`group: ⚛️ commit (${DEFAULT_LANE_STRING})`,
`group: ⚛️ layout effects (${DEFAULT_LANE_STRING})`,
'log: ⚛️ Example updated state (0b0000000000000000000000000000001)',
'groupEnd: ⚛️ layout effects (0b0000000000000000000001000000000)',
'groupEnd: ⚛️ commit (0b0000000000000000000001000000000)',
`groupEnd: ⚛️ layout effects (${DEFAULT_LANE_STRING})`,
`groupEnd: ⚛️ commit (${DEFAULT_LANE_STRING})`,
]);
});

Expand Down Expand Up @@ -277,10 +280,10 @@ describe('DebugTracing', () => {
}).toErrorDev('Cannot update during an existing state transition');

expect(logs).toEqual([
'group: ⚛️ render (0b0000000000000000000001000000000)',
'log: ⚛️ Example updated state (0b0000000000000000000001000000000)',
'log: ⚛️ Example updated state (0b0000000000000000000001000000000)',
'groupEnd: ⚛️ render (0b0000000000000000000001000000000)',
`group: ⚛️ render (${DEFAULT_LANE_STRING})`,
`log: ⚛️ Example updated state (${DEFAULT_LANE_STRING})`,
`log: ⚛️ Example updated state (${DEFAULT_LANE_STRING})`,
`groupEnd: ⚛️ render (${DEFAULT_LANE_STRING})`,
]);
});

Expand Down Expand Up @@ -308,11 +311,11 @@ describe('DebugTracing', () => {
expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ commit (0b0000000000000000000001000000000)',
'group: ⚛️ layout effects (0b0000000000000000000001000000000)',
`group: ⚛️ commit (${DEFAULT_LANE_STRING})`,
`group: ⚛️ layout effects (${DEFAULT_LANE_STRING})`,
'log: ⚛️ Example updated state (0b0000000000000000000000000000001)',
'groupEnd: ⚛️ layout effects (0b0000000000000000000001000000000)',
'groupEnd: ⚛️ commit (0b0000000000000000000001000000000)',
`groupEnd: ⚛️ layout effects (${DEFAULT_LANE_STRING})`,
`groupEnd: ⚛️ commit (${DEFAULT_LANE_STRING})`,
]);
});

Expand All @@ -335,9 +338,9 @@ describe('DebugTracing', () => {
);
});
expect(logs).toEqual([
'group: ⚛️ passive effects (0b0000000000000000000001000000000)',
'log: ⚛️ Example updated state (0b0000000000000000000001000000000)',
'groupEnd: ⚛️ passive effects (0b0000000000000000000001000000000)',
`group: ⚛️ passive effects (${DEFAULT_LANE_STRING})`,
`log: ⚛️ Example updated state (${DEFAULT_LANE_STRING})`,
`groupEnd: ⚛️ passive effects (${DEFAULT_LANE_STRING})`,
]);
});

Expand All @@ -361,10 +364,10 @@ describe('DebugTracing', () => {
});

expect(logs).toEqual([
'group: ⚛️ render (0b0000000000000000000001000000000)',
'log: ⚛️ Example updated state (0b0000000000000000000001000000000)',
'log: ⚛️ Example updated state (0b0000000000000000000001000000000)', // debugRenderPhaseSideEffectsForStrictMode
'groupEnd: ⚛️ render (0b0000000000000000000001000000000)',
`group: ⚛️ render (${DEFAULT_LANE_STRING})`,
`log: ⚛️ Example updated state (${DEFAULT_LANE_STRING})`,
`log: ⚛️ Example updated state (${DEFAULT_LANE_STRING})`, // debugRenderPhaseSideEffectsForStrictMode
`groupEnd: ⚛️ render (${DEFAULT_LANE_STRING})`,
]);
});

Expand All @@ -389,9 +392,9 @@ describe('DebugTracing', () => {
expect(Scheduler).toFlushUntilNextPaint([]);

expect(logs).toEqual([
'group: ⚛️ render (0b0000000000000000000001000000000)',
`group: ⚛️ render (${DEFAULT_LANE_STRING})`,
'log: Hello from user code',
'groupEnd: ⚛️ render (0b0000000000000000000001000000000)',
`groupEnd: ⚛️ render (${DEFAULT_LANE_STRING})`,
]);
});

Expand Down
Loading