Skip to content

Use fewer global variables in Hooks #17480

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

Merged
merged 9 commits into from
Dec 3, 2019
Merged

Use fewer global variables in Hooks #17480

Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
afc8eee
We don't need the global state for this
sebmarkbage Nov 27, 2019
302610c
Move componentUpdateQueue and sideEffectTag out of global state
sebmarkbage Nov 27, 2019
0d0bc76
Move remainingExpirationTime off global state
sebmarkbage Nov 28, 2019
d4b1793
Move firstWorkInProgressHook off global state
sebmarkbage Nov 28, 2019
0432096
Reset fiber to its current state if it throws
sebmarkbage Nov 28, 2019
3e77742
Move rerender error check to avoid global state
sebmarkbage Nov 28, 2019
cc1aa9d
Move next___Hook out of global state
sebmarkbage Nov 28, 2019
25aa2e5
Assert that currentlyRenderingFiber is always set
sebmarkbage Nov 28, 2019
1ea22f8
Add another test just to be safe
sebmarkbage Dec 3, 2019
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
Prev Previous commit
Next Next commit
Move componentUpdateQueue and sideEffectTag out of global state
  • Loading branch information
@sebmarkbage
sebmarkbage committed Nov 28, 2019
commit 302610c0baee6d77e7bf2b8e5a9ce7e3ddb880a5
26 changes: 12 additions & 14 deletions packages/react-reconciler/src/ReactFiberHooks.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -188,8 +188,6 @@ let workInProgressHook: Hook | null = null;
let nextWorkInProgressHook: Hook | null = null;

let remainingExpirationTime: ExpirationTime = NoWork;
let componentUpdateQueue: FunctionComponentUpdateQueue | null = null;
let sideEffectTag: SideEffectTag = 0;

// Updates scheduled during render will trigger an immediate re-render at the
// end of the current pass. We can't store these updates on the normal queue,
Expand Down Expand Up @@ -399,17 +397,17 @@ export function renderWithHooks(
current !== null && current.type !== workInProgress.type;
}

workInProgress.updateQueue = null;

// The following should have already been reset
// currentHook = null;
// workInProgressHook = null;

// remainingExpirationTime = NoWork;
// componentUpdateQueue = null;

// didScheduleRenderPhaseUpdate = false;
// renderPhaseUpdates = null;
// numberOfReRenders = 0;
// sideEffectTag = 0;

// TODO Warn if no hooks are used at all during mount, then some are used during update.
// Currently we will identify the update render as a mount because nextCurrentHook === null.
Expand Down Expand Up @@ -456,7 +454,8 @@ export function renderWithHooks(

currentHook = null;
workInProgressHook = null;
componentUpdateQueue = null;

workInProgress.updateQueue = null;

if (__DEV__) {
// Also validate hook order for cascading updates.
Expand All @@ -482,8 +481,6 @@ export function renderWithHooks(

renderedWork.memoizedState = firstWorkInProgressHook;
renderedWork.expirationTime = remainingExpirationTime;
renderedWork.updateQueue = (componentUpdateQueue: any);
renderedWork.effectTag |= sideEffectTag;

if (__DEV__) {
renderedWork._debugHookTypes = hookTypesDev;
Expand All @@ -510,8 +507,6 @@ export function renderWithHooks(
}

remainingExpirationTime = NoWork;
componentUpdateQueue = null;
sideEffectTag = 0;

// These were reset above
// didScheduleRenderPhaseUpdate = false;
Expand Down Expand Up @@ -565,8 +560,6 @@ export function resetHooks(): void {
}

remainingExpirationTime = NoWork;
componentUpdateQueue = null;
sideEffectTag = 0;

didScheduleRenderPhaseUpdate = false;
renderPhaseUpdates = null;
Expand Down Expand Up @@ -864,8 +857,10 @@ function pushEffect(tag, create, destroy, deps) {
// Circular
next: (null: any),
};
let fiber = ((currentlyRenderingFiber: any): Fiber);
let componentUpdateQueue: null | FunctionComponentUpdateQueue = (fiber.updateQueue: any);
if (componentUpdateQueue === null) {
componentUpdateQueue = createFunctionComponentUpdateQueue();
(fiber: any).updateQueue = componentUpdateQueue = createFunctionComponentUpdateQueue();
componentUpdateQueue.lastEffect = effect.next = effect;
} else {
const lastEffect = componentUpdateQueue.lastEffect;
Expand Down Expand Up @@ -899,7 +894,8 @@ function updateRef<T>(initialValue: T): {current: T} {
function mountEffectImpl(fiberEffectTag, hookEffectTag, create, deps): void {
const hook = mountWorkInProgressHook();
const nextDeps = deps === undefined ? null : deps;
sideEffectTag |= fiberEffectTag;
let fiber = ((currentlyRenderingFiber: any): Fiber);
fiber.effectTag |= fiberEffectTag;
hook.memoizedState = pushEffect(hookEffectTag, create, undefined, nextDeps);
}

Expand All @@ -920,7 +916,9 @@ function updateEffectImpl(fiberEffectTag, hookEffectTag, create, deps): void {
}
}

sideEffectTag |= fiberEffectTag;
let fiber = ((currentlyRenderingFiber: any): Fiber);
fiber.effectTag |= fiberEffectTag;

hook.memoizedState = pushEffect(hookEffectTag, create, destroy, nextDeps);
}

Expand Down