bubbleProperties() — react Function Reference
Architecture documentation for the bubbleProperties() function in ReactFiberCompleteWork.js from the react codebase.
Entity Profile
Dependency Diagram
graph TD 1a7e7cc1_6419_de9c_0611_6890ef404e66["bubbleProperties()"] 6b05669d_2f09_63a5_e79f_0afc195f25a3["ReactFiberCompleteWork.js"] 1a7e7cc1_6419_de9c_0611_6890ef404e66 -->|defined in| 6b05669d_2f09_63a5_e79f_0afc195f25a3 44c16661_4569_a3d1_aee6_5c634865dd4f["completeDehydratedActivityBoundary()"] 44c16661_4569_a3d1_aee6_5c634865dd4f -->|calls| 1a7e7cc1_6419_de9c_0611_6890ef404e66 f7a91352_2453_8bcd_5056_584b2804cbf7["completeDehydratedSuspenseBoundary()"] f7a91352_2453_8bcd_5056_584b2804cbf7 -->|calls| 1a7e7cc1_6419_de9c_0611_6890ef404e66 0b8db832_87fd_e560_8aa8_e2b319c81626["completeWork()"] 0b8db832_87fd_e560_8aa8_e2b319c81626 -->|calls| 1a7e7cc1_6419_de9c_0611_6890ef404e66 style 1a7e7cc1_6419_de9c_0611_6890ef404e66 fill:#6366f1,stroke:#818cf8,color:#fff
Relationship Graph
Source Code
packages/react-reconciler/src/ReactFiberCompleteWork.js lines 781–902
function bubbleProperties(completedWork: Fiber) {
const didBailout =
completedWork.alternate !== null &&
completedWork.alternate.child === completedWork.child;
let newChildLanes: Lanes = NoLanes;
let subtreeFlags: Flags = NoFlags;
if (!didBailout) {
// Bubble up the earliest expiration time.
if (enableProfilerTimer && (completedWork.mode & ProfileMode) !== NoMode) {
// In profiling mode, resetChildExpirationTime is also used to reset
// profiler durations.
let actualDuration = completedWork.actualDuration;
let treeBaseDuration = ((completedWork.selfBaseDuration: any): number);
let child = completedWork.child;
while (child !== null) {
newChildLanes = mergeLanes(
newChildLanes,
mergeLanes(child.lanes, child.childLanes),
);
subtreeFlags |= child.subtreeFlags;
subtreeFlags |= child.flags;
// When a fiber is cloned, its actualDuration is reset to 0. This value will
// only be updated if work is done on the fiber (i.e. it doesn't bailout).
// When work is done, it should bubble to the parent's actualDuration. If
// the fiber has not been cloned though, (meaning no work was done), then
// this value will reflect the amount of time spent working on a previous
// render. In that case it should not bubble. We determine whether it was
// cloned by comparing the child pointer.
// $FlowFixMe[unsafe-addition] addition with possible null/undefined value
actualDuration += child.actualDuration;
// $FlowFixMe[unsafe-addition] addition with possible null/undefined value
treeBaseDuration += child.treeBaseDuration;
child = child.sibling;
}
completedWork.actualDuration = actualDuration;
completedWork.treeBaseDuration = treeBaseDuration;
} else {
let child = completedWork.child;
while (child !== null) {
newChildLanes = mergeLanes(
newChildLanes,
mergeLanes(child.lanes, child.childLanes),
);
subtreeFlags |= child.subtreeFlags;
subtreeFlags |= child.flags;
// Update the return pointer so the tree is consistent. This is a code
// smell because it assumes the commit phase is never concurrent with
// the render phase. Will address during refactor to alternate model.
child.return = completedWork;
child = child.sibling;
}
}
completedWork.subtreeFlags |= subtreeFlags;
} else {
// Bubble up the earliest expiration time.
if (enableProfilerTimer && (completedWork.mode & ProfileMode) !== NoMode) {
// In profiling mode, resetChildExpirationTime is also used to reset
// profiler durations.
let treeBaseDuration = ((completedWork.selfBaseDuration: any): number);
let child = completedWork.child;
while (child !== null) {
newChildLanes = mergeLanes(
newChildLanes,
mergeLanes(child.lanes, child.childLanes),
);
// "Static" flags share the lifetime of the fiber/hook they belong to,
// so we should bubble those up even during a bailout. All the other
// flags have a lifetime only of a single render + commit, so we should
Domain
Subdomains
Source
Frequently Asked Questions
What does bubbleProperties() do?
bubbleProperties() is a function in the react codebase, defined in packages/react-reconciler/src/ReactFiberCompleteWork.js.
Where is bubbleProperties() defined?
bubbleProperties() is defined in packages/react-reconciler/src/ReactFiberCompleteWork.js at line 781.
What calls bubbleProperties()?
bubbleProperties() is called by 3 function(s): completeDehydratedActivityBoundary, completeDehydratedSuspenseBoundary, completeWork.
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free