Skip to content

Commit 0f274cd

Browse files
committed
Stub host config methods to suspend commit phase
This adds some new methods to the host config, but does not implement them yet. The purpose of these methods will be to allow the renderer to suspend right the commit phase without suspending render, like to wait for CSS to load before updating the screen. More context will be given subsequent steps. I didn't follow the `supportsHydration` pattern for optional host config methods because this feature seems pretty generally useful to any renderer, and declaring a no-op implementation is trivial. I didn't update the docs for react-reconciler yet because this very likely isn't the final layering. I'll document once the contract has stablized more.
1 parent 493a786 commit 0f274cd

File tree

10 files changed

+108
-0
lines changed

10 files changed

+108
-0
lines changed

packages/react-art/src/ReactARTHostConfig.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -459,6 +459,14 @@ export function requestPostPaintCallback(callback: (time: number) => void) {
459459
// noop
460460
}
461461

462+
export function shouldSuspendCommit(type, props) {
463+
return null;
464+
}
465+
466+
export function waitForCommitToBeReady(suspenseyThings) {
467+
return null;
468+
}
469+
462470
// eslint-disable-next-line no-undef
463471
export function prepareRendererToRender(container: Container): void {
464472
// noop

packages/react-dom-bindings/src/client/ReactDOMHostConfig.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,7 @@ export type ChildSet = void; // Unused
156156
export type TimeoutHandle = TimeoutID;
157157
export type NoTimeout = -1;
158158
export type RendererInspectionConfig = $ReadOnly<{}>;
159+
export type SuspendCommitPayload = null;
159160

160161
type SelectionInformation = {
161162
focusedElem: null | HTMLElement,
@@ -1608,6 +1609,20 @@ export function requestPostPaintCallback(callback: (time: number) => void) {
16081609
localRequestAnimationFrame(time => callback(time));
16091610
});
16101611
}
1612+
1613+
export function shouldSuspendCommit(
1614+
type: Type,
1615+
props: Props,
1616+
): SuspendCommitPayload | null {
1617+
return null;
1618+
}
1619+
1620+
export function waitForCommitToBeReady(
1621+
suspenseyThings: Array<SuspendCommitPayload> | null,
1622+
): null {
1623+
return null;
1624+
}
1625+
16111626
// -------------------
16121627
// Resources
16131628
// -------------------

packages/react-native-renderer/src/ReactFabricHostConfig.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,8 @@ export type RendererInspectionConfig = $ReadOnly<{
8787
) => void,
8888
}>;
8989

90+
export type SuspendCommitPayload = null;
91+
9092
// TODO: Remove this conditional once all changes have propagated.
9193
if (registerEventHandler) {
9294
/**
@@ -418,6 +420,19 @@ export function requestPostPaintCallback(callback: (time: number) => void) {
418420
// noop
419421
}
420422

423+
export function shouldSuspendCommit(
424+
type: Type,
425+
props: Props,
426+
): SuspendCommitPayload | null {
427+
return null;
428+
}
429+
430+
export function waitForCommitToBeReady(
431+
suspenseyThings: Array<SuspendCommitPayload> | null,
432+
): null {
433+
return null;
434+
}
435+
421436
export function prepareRendererToRender(container: Container): void {
422437
// noop
423438
}

packages/react-native-renderer/src/ReactNativeHostConfig.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,8 @@ export type RendererInspectionConfig = $ReadOnly<{
5555
) => void,
5656
}>;
5757

58+
export type SuspendCommitPayload = null;
59+
5860
const UPDATE_SIGNAL = {};
5961
if (__DEV__) {
6062
Object.freeze(UPDATE_SIGNAL);
@@ -522,6 +524,19 @@ export function requestPostPaintCallback(callback: (time: number) => void) {
522524
// noop
523525
}
524526

527+
export function shouldSuspendCommit(
528+
type: Type,
529+
props: Props,
530+
): SuspendCommitPayload | null {
531+
return null;
532+
}
533+
534+
export function waitForCommitToBeReady(
535+
suspenseyThings: Array<SuspendCommitPayload> | null,
536+
): null {
537+
return null;
538+
}
539+
525540
export function prepareRendererToRender(container: Container): void {
526541
// noop
527542
}

packages/react-noop-renderer/src/ReactNoop.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,9 @@ export const {
2828
createLegacyRoot,
2929
getChildrenAsJSX,
3030
getPendingChildrenAsJSX,
31+
getSuspenseyThingStatus,
32+
resolveSuspenseyThing,
33+
resetSuspenseyThingCache,
3134
createPortal,
3235
render,
3336
renderLegacySyncRoot,

packages/react-noop-renderer/src/ReactNoopPersistent.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,9 @@ export const {
2828
createLegacyRoot,
2929
getChildrenAsJSX,
3030
getPendingChildrenAsJSX,
31+
getSuspenseyThingStatus,
32+
resolveSuspenseyThing,
33+
resetSuspenseyThingCache,
3134
createPortal,
3235
render,
3336
renderLegacySyncRoot,

packages/react-noop-renderer/src/createReactNoop.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,8 @@ type CreateRootOptions = {
7272
...
7373
};
7474

75+
type SuspendCommitPayload = string;
76+
7577
const NO_CONTEXT = {};
7678
const UPPERCASE_CONTEXT = {};
7779
const UPDATE_SIGNAL = {};
@@ -480,6 +482,20 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
480482
const endTime = Scheduler.unstable_now();
481483
callback(endTime);
482484
},
485+
486+
shouldSuspendCommit(
487+
type: string,
488+
props: Props,
489+
): SuspendCommitPayload | null {
490+
return null;
491+
},
492+
493+
waitForCommitToBeReady(
494+
suspenseyThings: Array<SuspendCommitPayload> | null,
495+
): null {
496+
return null;
497+
},
498+
483499
prepareRendererToRender() {},
484500
resetRendererAfterRender() {},
485501
};

packages/react-reconciler/src/__tests__/ReactFiberHostContext-test.internal.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,12 @@ describe('ReactFiberHostContext', () => {
7171
return DefaultEventPriority;
7272
},
7373
requestPostPaintCallback: function () {},
74+
shouldSuspendCommit(type, props) {
75+
return null;
76+
},
77+
waitForCommitToBeReady(suspenseyThings) {
78+
return null;
79+
},
7480
prepareRendererToRender: function () {},
7581
resetRendererAfterRender: function () {},
7682
supportsMutation: true,

packages/react-reconciler/src/forks/ReactFiberHostConfig.custom.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ export opaque type ChildSet = mixed; // eslint-disable-line no-undef
3838
export opaque type TimeoutHandle = mixed; // eslint-disable-line no-undef
3939
export opaque type NoTimeout = mixed; // eslint-disable-line no-undef
4040
export opaque type RendererInspectionConfig = mixed; // eslint-disable-line no-undef
41+
export opaque type SuspendCommitPayload = mixed; // eslint-disable-line no-undef
4142
export type EventResponder = any;
4243

4344
export const getPublicInstance = $$$hostConfig.getPublicInstance;
@@ -68,6 +69,8 @@ export const getInstanceFromScope = $$$hostConfig.getInstanceFromScope;
6869
export const getCurrentEventPriority = $$$hostConfig.getCurrentEventPriority;
6970
export const detachDeletedInstance = $$$hostConfig.detachDeletedInstance;
7071
export const requestPostPaintCallback = $$$hostConfig.requestPostPaintCallback;
72+
export const shouldSuspendCommit = $$$hostConfig.shouldSuspendCommit;
73+
export const waitForCommitToBeReady = $$$hostConfig.waitForCommitToBeReady;
7174
export const prepareRendererToRender = $$$hostConfig.prepareRendererToRender;
7275
export const resetRendererAfterRender = $$$hostConfig.resetRendererAfterRender;
7376

packages/react-test-renderer/src/ReactTestHostConfig.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,8 @@ export type EventResponder = any;
4242

4343
export type RendererInspectionConfig = $ReadOnly<{}>;
4444

45+
export type SuspendCommitPayload = null;
46+
4547
export * from 'react-reconciler/src/ReactFiberHostConfigWithNoPersistence';
4648
export * from 'react-reconciler/src/ReactFiberHostConfigWithNoHydration';
4749
export * from 'react-reconciler/src/ReactFiberHostConfigWithNoTestSelectors';
@@ -324,6 +326,28 @@ export function requestPostPaintCallback(callback: (time: number) => void) {
324326
// noop
325327
}
326328

329+
export function shouldSuspendCommit(
330+
type: Type,
331+
props: Props,
332+
): SuspendCommitPayload | null {
333+
return null;
334+
}
335+
336+
export function shouldSuspendUpdate(
337+
instance: Instance,
338+
type: Type,
339+
oldProps: Props,
340+
newProps: Props,
341+
): SuspendCommitPayload | null {
342+
return null;
343+
}
344+
345+
export function waitForCommitToBeReady(
346+
suspenseyThings: Array<SuspendCommitPayload> | null,
347+
): null {
348+
return null;
349+
}
350+
327351
export function prepareRendererToRender(container: Container): void {
328352
// noop
329353
}

0 commit comments

Comments
 (0)