Skip to content

Commit

Permalink
old
Browse files Browse the repository at this point in the history
  • Loading branch information
@lunaruan
lunaruan committed Apr 5, 2022
1 parent b6dcc6f commit f560514
Show file tree
Hide file tree
Showing 12 changed files with 493 additions and 146 deletions.
84 changes: 63 additions & 21 deletions packages/react-reconciler/src/ReactFiberBeginWork.old.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -237,7 +237,6 @@ import {
markSkippedUpdateLanes,
getWorkInProgressRoot,
pushRenderLanes,
getWorkInProgressTransitions,
} from './ReactFiberWorkLoop.old';
import {setWorkInProgressVersion} from './ReactMutableSource.old';
import {pushCacheProvider, CacheContext} from './ReactFiberCacheComponent.old';
Expand All @@ -257,6 +256,7 @@ import {
getSuspendedCache,
pushTransition,
getOffscreenDeferredCache,
getSuspendedTransitions,
} from './ReactFiberTransition.old';

const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
Expand Down Expand Up @@ -653,16 +653,18 @@ function updateOffscreenComponent(
// Rendering a hidden tree.
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
// In legacy sync mode, don't defer the subtree. Render it now.
// TODO: Consider how Offscreen should work with transitions in the future
const nextState: OffscreenState = {
baseLanes: NoLanes,
cachePool: null,
transitions: null,
};
workInProgress.memoizedState = nextState;
if (enableCache) {
// push the cache pool even though we're going to bail out
// because otherwise there'd be a context mismatch
if (current !== null) {
pushTransition(workInProgress, null);
pushTransition(workInProgress, null, null);
}
}
pushRenderLanes(workInProgress, renderLanes);
Expand All @@ -689,14 +691,15 @@ function updateOffscreenComponent(
const nextState: OffscreenState = {
baseLanes: nextBaseLanes,
cachePool: spawnedCachePool,
transitions: null,
};
workInProgress.memoizedState = nextState;
workInProgress.updateQueue = null;
if (enableCache) {
// push the cache pool even though we're going to bail out
// because otherwise there'd be a context mismatch
if (current !== null) {
pushTransition(workInProgress, null);
pushTransition(workInProgress, null, null);
}
}

Expand Down Expand Up @@ -724,6 +727,7 @@ function updateOffscreenComponent(
const nextState: OffscreenState = {
baseLanes: NoLanes,
cachePool: null,
transitions: null,
};
workInProgress.memoizedState = nextState;
// Push the lanes that were skipped when we bailed out.
Expand All @@ -734,7 +738,7 @@ function updateOffscreenComponent(
// using the same cache. Unless the parent changed, since that means
// there was a refresh.
const prevCachePool = prevState !== null ? prevState.cachePool : null;
pushTransition(workInProgress, prevCachePool);
pushTransition(workInProgress, prevCachePool, null);
}

pushRenderLanes(workInProgress, subtreeRenderLanes);
Expand All @@ -747,14 +751,21 @@ function updateOffscreenComponent(

subtreeRenderLanes = mergeLanes(prevState.baseLanes, renderLanes);

let prevCachePool = null;
if (enableCache) {
// If the render that spawned this one accessed the cache pool, resume
// using the same cache. Unless the parent changed, since that means
// there was a refresh.
const prevCachePool = prevState.cachePool;
pushTransition(workInProgress, prevCachePool);
prevCachePool = prevState.cachePool;
}

let transitions = null;
if (enableTransitionTracing) {
transitions = prevState.transitions;
}

pushTransition(workInProgress, prevCachePool, transitions);

// Since we're not hidden anymore, reset the state
workInProgress.memoizedState = null;
} else {
Expand All @@ -768,7 +779,7 @@ function updateOffscreenComponent(
// using the same cache. Unless the parent changed, since that means
// there was a refresh.
if (current !== null) {
pushTransition(workInProgress, null);
pushTransition(workInProgress, null, null);
}
}
}
Expand Down Expand Up @@ -1326,28 +1337,25 @@ function updateHostRoot(current, workInProgress, renderLanes) {
const nextProps = workInProgress.pendingProps;
const prevState = workInProgress.memoizedState;
const prevChildren = prevState.element;

cloneUpdateQueue(current, workInProgress);
processUpdateQueue(workInProgress, nextProps, null, renderLanes);

const nextState: RootState = workInProgress.memoizedState;
const root: FiberRoot = workInProgress.stateNode;

pushRootTransition(workInProgress, root, renderLanes);

if (enableCache) {
const nextCache: Cache = nextState.cache;
pushRootTransition(root);
const nextCache: Cache = workInProgress.memoizedState.cache;
pushCacheProvider(workInProgress, nextCache);
if (nextCache !== prevState.cache) {
// The root cache refreshed.
propagateContextChange(workInProgress, CacheContext, renderLanes);
}
}

if (enableTransitionTracing) {
// FIXME: Slipped past code review. This is not a safe mutation:
// workInProgress.memoizedState is a shared object. Need to fix before
// rolling out the Transition Tracing experiment.
workInProgress.memoizedState.transitions = getWorkInProgressTransitions();
}
const pendingSuspenseBoundaries = nextState.pendingSuspenseBoundaries || null;

// Caution: React DevTools currently depends on this property
// being called "element".
Expand All @@ -1362,6 +1370,7 @@ function updateHostRoot(current, workInProgress, renderLanes) {
element: nextChildren,
isDehydrated: false,
cache: nextState.cache,
pendingSuspenseBoundaries,
transitions: nextState.transitions,
};
const updateQueue: UpdateQueue<RootState> = (workInProgress.updateQueue: any);
Expand Down Expand Up @@ -1435,6 +1444,20 @@ function updateHostRoot(current, workInProgress, renderLanes) {
}
}
} else {
if (enableTransitionTracing) {
if (pendingSuspenseBoundaries !== nextState.pendingSuspenseBoundaries) {
const overrideState: RootState = {
element: nextChildren,
isDehydrated: nextState.isDehydrated,
cache: nextState.cache,
pendingSuspenseBoundaries,
transitions: nextState.transitions,
};

workInProgress.memoizedState = overrideState;
}
}

// Root is not dehydrated. Either this is a client-only root, or it
// already hydrated.
resetHydrationState();
Expand Down Expand Up @@ -1979,6 +2002,7 @@ function mountSuspenseOffscreenState(renderLanes: Lanes): OffscreenState {
return {
baseLanes: renderLanes,
cachePool: getSuspendedCache(),
transitions: getSuspendedTransitions(),
};
}

Expand Down Expand Up @@ -2010,9 +2034,11 @@ function updateSuspenseOffscreenState(
cachePool = getSuspendedCache();
}
}

return {
baseLanes: mergeLanes(prevOffscreenState.baseLanes, renderLanes),
cachePool,
transitions: prevOffscreenState.transitions,
};
}

Expand Down Expand Up @@ -2103,6 +2129,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {

pushSuspenseContext(workInProgress, suspenseContext);

const root = getWorkInProgressRoot();

// OK, the next part is confusing. We're about to reconcile the Suspense
// boundary's children. This involves some custom reconciliation logic. Two
// main reasons this is so complicated.
Expand Down Expand Up @@ -2143,7 +2171,6 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
}
}
}

const nextPrimaryChildren = nextProps.children;
const nextFallbackChildren = nextProps.fallback;

Expand All @@ -2159,6 +2186,18 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
renderLanes,
);
workInProgress.memoizedState = SUSPENDED_MARKER;
if (enableTransitionTracing) {
const currentTransitions = getSuspendedTransitions();
if (currentTransitions !== null) {
const primaryChildUpdateQueue: OffscreenQueue = {
transitions: currentTransitions,
rootMemoizedState:
root === null ? null : root.current.memoizedState,
};
primaryChildFragment.updateQueue = primaryChildUpdateQueue;
}
}

return fallbackFragment;
} else if (
enableCPUSuspense &&
Expand Down Expand Up @@ -2285,6 +2324,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
if (currentTransitions !== null) {
const primaryChildUpdateQueue: OffscreenQueue = {
transitions: currentTransitions,
rootMemoizedState:
root === null ? null : root.current.memoizedState,
};
primaryChildFragment.updateQueue = primaryChildUpdateQueue;
}
Expand Down Expand Up @@ -2336,6 +2377,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
if (currentTransitions !== null) {
const primaryChildUpdateQueue: OffscreenQueue = {
transitions: currentTransitions,
rootMemoizedState:
root === null ? null : root.current.memoizedState,
};
primaryChildFragment.updateQueue = primaryChildUpdateQueue;
}
Expand Down Expand Up @@ -2368,6 +2411,7 @@ function mountSuspensePrimaryChildren(
renderLanes,
) {
const mode = workInProgress.mode;

const primaryChildProps: OffscreenProps = {
mode: 'visible',
children: primaryChildren,
Expand All @@ -2390,7 +2434,6 @@ function mountSuspenseFallbackChildren(
) {
const mode = workInProgress.mode;
const progressedPrimaryFragment: Fiber | null = workInProgress.child;

const primaryChildProps: OffscreenProps = {
mode: 'hidden',
children: primaryChildren,
Expand Down Expand Up @@ -3594,14 +3637,13 @@ function attemptEarlyBailoutIfNoScheduledUpdate(
case HostRoot:
pushHostRootContext(workInProgress);
const root: FiberRoot = workInProgress.stateNode;
pushRootTransition(workInProgress, root, renderLanes);

if (enableCache) {
const cache: Cache = current.memoizedState.cache;
pushCacheProvider(workInProgress, cache);
pushRootTransition(root);
}
if (enableTransitionTracing) {
workInProgress.memoizedState.transitions = getWorkInProgressTransitions();
}

resetHydrationState();
break;
case HostComponent:
Expand Down
2 changes: 1 addition & 1 deletion packages/react-reconciler/src/ReactFiberCacheComponent.old.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ import {enableCache} from 'shared/ReactFeatureFlags';
import {REACT_CONTEXT_TYPE} from 'shared/ReactSymbols';

import {pushProvider, popProvider} from './ReactFiberNewContext.old';
import * as Scheduler from 'scheduler';

import * as Scheduler from 'scheduler';
export type Cache = {|
controller: AbortController,
data: Map<() => mixed, mixed>,
Expand Down
Loading

0 comments on commit f560514

Please sign in to comment.