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.

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

Re-arrange slightly to prevent refactor hazard #16743

Merged
merged 11 commits into from
Sep 11, 2019

Conversation

acdlite
Copy link
Collaborator

@acdlite acdlite commented Sep 10, 2019

Based on #16715, #16678, and #16663

It should not be possible to perform any work on a root without calling ensureRootIsScheduled before exiting. Otherwise, we could fail to schedule a callback for pending work and the app could freeze.

To help prevent a future refactor from introducing such a bug, this change makes it so that renderRoot is always wrapped in try-finally, and the finally block calls ensureRootIsScheduled.

A FiberRoot can have pending work at many distinct priorities. (Note: we
refer to these levels as "expiration times" to distinguish the concept
from Scheduler's notion of priority levels, which represent broad
categories of work. React expiration times are more granualar. They're
more like a concurrent thread ID, which also happens to correspond to a
moment on a timeline. It's an overloaded concept and I'm handwaving over
some of the details.)

Given a root, there's no convenient way to read all the pending levels
in the entire tree, i.e. there's no single queue-like structure that
tracks all the levels, because that granularity of information is not
needed by our algorithms. Instead we track the subset of information
that we actually need — most importantly, the highest priority level
that exists in the entire tree.

Aside from that, the other information we track includes the range of
pending levels that are known to be suspended, and therefore should not
be worked on.

This is a refactor of how that information is tracked, and what each
field represents:

- A *pending* level is work that is unfinished, or not yet committed.
  This includes work that is suspended from committing.
  `firstPendingTime` and `lastPendingTime` represent the range of
  pending work. (Previously, "pending" was the same as "not suspended.")
- A *suspended* level is work that did not complete because data was
  missing. `firstSuspendedTime` and `lastSuspendedTime` represent the
  range of suspended work. It is a subset of the pending range. (These
  fields are new to this commit.)
- `nextAfterSuspendedTime` represents the next known level that comes
  after the suspended range.

This commit doesn't change much in terms of observable behavior. The one
change is that, when a level is suspended, React will continue working
on the next known level instead of jumping straight to the last pending
level. Subsequent commits will use this new structure for a more
substantial refactor for how tasks are scheduled per root.
Given a FiberRoot, we should be able to determine the next expiration
time that needs to be worked on, taking into account the levels that
are pending, suspended, pinged, and so on.

This removes the `expirationTime` argument from
`scheduleCallbackForRoot`, and renames it to `ensureRootIsScheduled` to
reflect the new signature. The expiration time is instead read from the
root using a new function, `getNextExpirationTimeToWorkOn`.

The next step will be to remove the `expirationTime` argument from
`renderRoot`, too.
This is a fragile pattern because there's only meant to be a single
task per root, running at a single expiration time. Instead of binding
the expiration time to the render task, or closing over it, we should
determine the correct expiration time to work on using fields we
store on the root object itself.

This removes the "return a continuation" pattern from the
`renderRoot` function. Continuation handling is now handled by
the wrapper function, which I've renamed from `runRootCallback` to
`performWorkOnRoot`. That function is merely an entry point to
`renderRoot`, so I've also removed the callback argument.

So to sum up, at at the beginning of each task, `performWorkOnRoot`
determines which expiration time to work on, then calls `renderRoot`.
And before exiting, it checks if it needs to schedule another task.
It's no longer used anywhere
If the work-in-progress root already suspended with a delay, then the
current render definitely won't finish. We should interrupt the render
and switch to the incoming update.
Similar to the previous commit, if we suspend with a delay, and
something in the return path has a pending update, we should abort
the current render and switch to the update instead.
Instead of backtracking the return path. The main advantage over the
backtracking approach is that we don't have to backtrack from the source
fiber. (The main disadvantages are that it requires another module-level
variable, and that it could include updates from unrelated
sibling paths.)
It should not be possible to perform any work on a root without
calling `ensureRootIsScheduled` before exiting. Otherwise, we could
fail to schedule a callback for pending work and the app could freeze.

To help prevent a future refactor from introducing such a bug, this
change makes it so that `renderRoot` is always wrapped in try-finally,
and the `finally` block calls `ensureRootIsScheduled`.
@sizebot
Copy link

sizebot commented Sep 10, 2019

ReactDOM: size: 0.0%, gzip: 0.0%

Details of bundled changes.

Comparing: 9ce8711...8b5dcd3

react-dom

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-dom.profiling.min.js +1.1% +1.0% 115.32 KB 116.6 KB 36.35 KB 36.71 KB NODE_PROFILING
react-dom-server.browser.development.js 0.0% 0.0% 142.1 KB 142.1 KB 37.12 KB 37.12 KB UMD_DEV
ReactDOM-dev.js +0.8% +0.8% 939.12 KB 946.35 KB 207.42 KB 209.05 KB FB_WWW_DEV
react-dom-server.browser.production.min.js 0.0% 0.0% 19.8 KB 19.8 KB 7.36 KB 7.36 KB UMD_PROD
react-dom-test-utils.development.js 0.0% -0.0% 57.25 KB 57.25 KB 15.78 KB 15.78 KB UMD_DEV
react-dom-unstable-fizz.browser.development.js 0.0% -0.1% 3.78 KB 3.78 KB 1.53 KB 1.53 KB UMD_DEV
react-dom-test-utils.production.min.js 0.0% -0.0% 11.18 KB 11.18 KB 4.15 KB 4.15 KB UMD_PROD
react-dom-unstable-fizz.browser.production.min.js 0.0% -0.1% 1.2 KB 1.2 KB 701 B 700 B UMD_PROD
react-dom-test-utils.development.js 0.0% -0.0% 55.52 KB 55.52 KB 15.45 KB 15.45 KB NODE_DEV
react-dom-unstable-fizz.browser.development.js 0.0% -0.1% 3.61 KB 3.61 KB 1.48 KB 1.48 KB NODE_DEV
react-dom-test-utils.production.min.js 0.0% -0.0% 10.95 KB 10.95 KB 4.09 KB 4.09 KB NODE_PROD
react-dom.development.js +0.8% +0.8% 914.99 KB 922.24 KB 207.39 KB 209.04 KB UMD_DEV
react-dom.production.min.js 🔺+1.1% 🔺+0.8% 111.71 KB 112.91 KB 36.02 KB 36.32 KB UMD_PROD
react-dom.profiling.min.js +1.2% +0.8% 115.12 KB 116.45 KB 37.08 KB 37.37 KB UMD_PROFILING
react-dom.development.js +0.8% +0.8% 909.08 KB 916.32 KB 205.71 KB 207.33 KB NODE_DEV
react-dom-server.node.development.js 0.0% 0.0% 139.05 KB 139.05 KB 36.34 KB 36.34 KB NODE_DEV
react-dom.production.min.js 🔺+1.1% 🔺+0.9% 111.68 KB 112.88 KB 35.39 KB 35.69 KB NODE_PROD
ReactDOM-prod.js 🔺+1.3% 🔺+1.0% 372 KB 376.99 KB 68.15 KB 68.82 KB FB_WWW_PROD
ReactDOM-profiling.js +1.5% +1.1% 377.55 KB 383.05 KB 69.21 KB 69.96 KB FB_WWW_PROFILING
react-dom-server.browser.development.js 0.0% 0.0% 138.04 KB 138.04 KB 36.11 KB 36.11 KB NODE_DEV
react-dom-server.browser.production.min.js 0.0% 0.0% 19.73 KB 19.73 KB 7.34 KB 7.34 KB NODE_PROD
react-dom-unstable-native-dependencies.development.js 0.0% -0.0% 60.71 KB 60.71 KB 15.85 KB 15.84 KB UMD_DEV
react-dom-unstable-native-dependencies.production.min.js 0.0% -0.0% 10.75 KB 10.75 KB 3.68 KB 3.67 KB UMD_PROD
ReactDOMServer-prod.js 0.0% -0.0% 48.58 KB 48.58 KB 11.11 KB 11.11 KB FB_WWW_PROD
react-dom-unstable-native-dependencies.development.js 0.0% -0.0% 60.39 KB 60.39 KB 15.72 KB 15.72 KB NODE_DEV
react-dom-unstable-native-dependencies.production.min.js 0.0% -0.0% 10.49 KB 10.49 KB 3.58 KB 3.58 KB NODE_PROD
react-dom-unstable-fizz.node.production.min.js 0.0% -0.1% 1.1 KB 1.1 KB 667 B 666 B NODE_PROD

react-art

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-art.development.js +1.1% +1.0% 657.27 KB 664.5 KB 143.12 KB 144.62 KB UMD_DEV
react-art.production.min.js 🔺+1.2% 🔺+0.9% 101.93 KB 103.16 KB 31.17 KB 31.46 KB UMD_PROD
react-art.development.js +1.2% +1.2% 587.95 KB 595.17 KB 125.67 KB 127.2 KB NODE_DEV
react-art.production.min.js 🔺+1.8% 🔺+1.4% 66.94 KB 68.17 KB 20.4 KB 20.69 KB NODE_PROD
ReactART-dev.js +1.2% +1.2% 603.18 KB 610.39 KB 125.4 KB 126.93 KB FB_WWW_DEV
ReactART-prod.js 🔺+2.2% 🔺+1.7% 225.92 KB 230.87 KB 38.47 KB 39.14 KB FB_WWW_PROD

react-native-renderer

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
ReactNativeRenderer-prod.js 🔺+1.9% 🔺+1.7% 269.9 KB 274.92 KB 46.26 KB 47.05 KB RN_OSS_PROD
ReactNativeRenderer-profiling.js +2.1% +1.7% 278.4 KB 284.12 KB 47.8 KB 48.59 KB RN_OSS_PROFILING
ReactFabric-prod.js 🔺+1.9% 🔺+1.5% 261.69 KB 266.71 KB 44.95 KB 45.62 KB RN_OSS_PROD
ReactFabric-profiling.js +2.1% +1.7% 270.44 KB 276.22 KB 46.47 KB 47.24 KB RN_OSS_PROFILING
ReactFabric-dev.js +1.0% +1.0% 742.49 KB 749.71 KB 156.9 KB 158.52 KB RN_FB_DEV
ReactFabric-prod.js 🔺+1.9% 🔺+1.5% 261.7 KB 266.71 KB 44.96 KB 45.63 KB RN_FB_PROD
ReactNativeRenderer-dev.js +1.0% +1.0% 735.89 KB 743.11 KB 155.72 KB 157.34 KB RN_OSS_DEV
ReactFabric-profiling.js +2.1% +1.7% 270.44 KB 276.22 KB 46.48 KB 47.25 KB RN_FB_PROFILING
ReactNativeRenderer-dev.js +1.0% +1.0% 736.05 KB 743.27 KB 155.81 KB 157.44 KB RN_FB_DEV
ReactNativeRenderer-prod.js 🔺+1.9% 🔺+1.7% 269.9 KB 274.91 KB 46.27 KB 47.06 KB RN_FB_PROD
ReactNativeRenderer-profiling.js +2.1% +1.7% 278.39 KB 284.11 KB 47.81 KB 48.6 KB RN_FB_PROFILING
ReactFabric-dev.js +1.0% +1.0% 742.32 KB 749.54 KB 156.83 KB 158.44 KB RN_OSS_DEV

react-test-renderer

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
ReactTestRenderer-dev.js +1.2% +1.2% 614.27 KB 621.48 KB 127.81 KB 129.35 KB FB_WWW_DEV
react-test-renderer-shallow.development.js 0.0% -0.0% 39.21 KB 39.21 KB 9.95 KB 9.95 KB UMD_DEV
react-test-renderer-shallow.production.min.js 0.0% 0.0% 11.41 KB 11.41 KB 3.53 KB 3.53 KB UMD_PROD
react-test-renderer-shallow.development.js 0.0% -0.0% 33.18 KB 33.18 KB 8.49 KB 8.49 KB NODE_DEV
react-test-renderer-shallow.production.min.js 0.0% 0.0% 11.55 KB 11.55 KB 3.62 KB 3.62 KB NODE_PROD
react-test-renderer.development.js +1.2% +1.2% 601.29 KB 608.52 KB 128.44 KB 129.97 KB UMD_DEV
react-test-renderer.production.min.js 🔺+1.8% 🔺+1.4% 68.88 KB 70.11 KB 21.18 KB 21.48 KB UMD_PROD
react-test-renderer.development.js +1.2% +1.2% 596.63 KB 603.84 KB 127.24 KB 128.78 KB NODE_DEV
react-test-renderer.production.min.js 🔺+1.8% 🔺+1.4% 68.57 KB 69.8 KB 20.9 KB 21.2 KB NODE_PROD

react-reconciler

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-reconciler.development.js +1.2% +1.3% 586.59 KB 593.83 KB 124.37 KB 125.97 KB NODE_DEV
react-reconciler.production.min.js 🔺+1.7% 🔺+1.5% 68.94 KB 70.14 KB 20.44 KB 20.75 KB NODE_PROD
react-reconciler-reflection.development.js 0.0% -0.0% 19.25 KB 19.25 KB 6.33 KB 6.33 KB NODE_DEV
react-reconciler-reflection.production.min.js 0.0% -0.2% 2.56 KB 2.56 KB 1.14 KB 1.14 KB NODE_PROD
react-reconciler-persistent.development.js +1.2% +1.3% 583.6 KB 590.84 KB 123.1 KB 124.72 KB NODE_DEV
react-reconciler-persistent.production.min.js 🔺+1.7% 🔺+1.5% 68.95 KB 70.15 KB 20.45 KB 20.75 KB NODE_PROD

Generated by 🚫 dangerJS against 8b5dcd3

There are a few leftover cases where `renderRoot` is called recursively.
All of them are related to synchronously flushing work before its
expiration time.

We can remove these calls by tracking the last expired level on the
root, similar to what we do for other types of pending work, like pings.
@acdlite acdlite force-pushed the ensure-callback-in-finally branch 3 times, most recently from 54371a9 to 2ca796b Compare September 11, 2019 00:26
Read the expiration time from the root, like we do
in performConcurrentWorkOnRoot.
@acdlite acdlite merged commit ab4951f into facebook:master Sep 11, 2019
acdlite added a commit to acdlite/react that referenced this pull request Sep 12, 2019
This reverts commit ab4951f.

* Track "pending" and "suspended" ranges

A FiberRoot can have pending work at many distinct priorities. (Note: we
refer to these levels as "expiration times" to distinguish the concept
from Scheduler's notion of priority levels, which represent broad
categories of work. React expiration times are more granualar. They're
more like a concurrent thread ID, which also happens to correspond to a
moment on a timeline. It's an overloaded concept and I'm handwaving over
some of the details.)

Given a root, there's no convenient way to read all the pending levels
in the entire tree, i.e. there's no single queue-like structure that
tracks all the levels, because that granularity of information is not
needed by our algorithms. Instead we track the subset of information
that we actually need — most importantly, the highest priority level
that exists in the entire tree.

Aside from that, the other information we track includes the range of
pending levels that are known to be suspended, and therefore should not
be worked on.

This is a refactor of how that information is tracked, and what each
field represents:

- A *pending* level is work that is unfinished, or not yet committed.
  This includes work that is suspended from committing.
  `firstPendingTime` and `lastPendingTime` represent the range of
  pending work. (Previously, "pending" was the same as "not suspended.")
- A *suspended* level is work that did not complete because data was
  missing. `firstSuspendedTime` and `lastSuspendedTime` represent the
  range of suspended work. It is a subset of the pending range. (These
  fields are new to this commit.)
- `nextAfterSuspendedTime` represents the next known level that comes
  after the suspended range.

This commit doesn't change much in terms of observable behavior. The one
change is that, when a level is suspended, React will continue working
on the next known level instead of jumping straight to the last pending
level. Subsequent commits will use this new structure for a more
substantial refactor for how tasks are scheduled per root.

* Get next expiration time from FiberRoot

Given a FiberRoot, we should be able to determine the next expiration
time that needs to be worked on, taking into account the levels that
are pending, suspended, pinged, and so on.

This removes the `expirationTime` argument from
`scheduleCallbackForRoot`, and renames it to `ensureRootIsScheduled` to
reflect the new signature. The expiration time is instead read from the
root using a new function, `getNextExpirationTimeToWorkOn`.

The next step will be to remove the `expirationTime` argument from
`renderRoot`, too.

* Don't bind expiration time to render callback

This is a fragile pattern because there's only meant to be a single
task per root, running at a single expiration time. Instead of binding
the expiration time to the render task, or closing over it, we should
determine the correct expiration time to work on using fields we
store on the root object itself.

This removes the "return a continuation" pattern from the
`renderRoot` function. Continuation handling is now handled by
the wrapper function, which I've renamed from `runRootCallback` to
`performWorkOnRoot`. That function is merely an entry point to
`renderRoot`, so I've also removed the callback argument.

So to sum up, at at the beginning of each task, `performWorkOnRoot`
determines which expiration time to work on, then calls `renderRoot`.
And before exiting, it checks if it needs to schedule another task.

* Update error recovery test to match new semantics

* Remove `lastPendingTime` field

It's no longer used anywhere

* Restart on update to already suspended root

If the work-in-progress root already suspended with a delay, then the
current render definitely won't finish. We should interrupt the render
and switch to the incoming update.

* Restart on suspend if return path has an update

Similar to the previous commit, if we suspend with a delay, and
something in the return path has a pending update, we should abort
the current render and switch to the update instead.

* Track the next unprocessed level globally

Instead of backtracking the return path. The main advantage over the
backtracking approach is that we don't have to backtrack from the source
fiber. (The main disadvantages are that it requires another module-level
variable, and that it could include updates from unrelated
sibling paths.)

* Re-arrange slightly to prevent refactor hazard

It should not be possible to perform any work on a root without
calling `ensureRootIsScheduled` before exiting. Otherwise, we could
fail to schedule a callback for pending work and the app could freeze.

To help prevent a future refactor from introducing such a bug, this
change makes it so that `renderRoot` is always wrapped in try-finally,
and the `finally` block calls `ensureRootIsScheduled`.

* Remove recursive calls to `renderRoot`.

There are a few leftover cases where `renderRoot` is called recursively.
All of them are related to synchronously flushing work before its
expiration time.

We can remove these calls by tracking the last expired level on the
root, similar to what we do for other types of pending work, like pings.

* Remove argument from performSyncWorkOnRoot

Read the expiration time from the root, like we do
in performConcurrentWorkOnRoot.
acdlite added a commit that referenced this pull request Sep 12, 2019
)

This reverts commit ab4951f.

* Track "pending" and "suspended" ranges

A FiberRoot can have pending work at many distinct priorities. (Note: we
refer to these levels as "expiration times" to distinguish the concept
from Scheduler's notion of priority levels, which represent broad
categories of work. React expiration times are more granualar. They're
more like a concurrent thread ID, which also happens to correspond to a
moment on a timeline. It's an overloaded concept and I'm handwaving over
some of the details.)

Given a root, there's no convenient way to read all the pending levels
in the entire tree, i.e. there's no single queue-like structure that
tracks all the levels, because that granularity of information is not
needed by our algorithms. Instead we track the subset of information
that we actually need — most importantly, the highest priority level
that exists in the entire tree.

Aside from that, the other information we track includes the range of
pending levels that are known to be suspended, and therefore should not
be worked on.

This is a refactor of how that information is tracked, and what each
field represents:

- A *pending* level is work that is unfinished, or not yet committed.
  This includes work that is suspended from committing.
  `firstPendingTime` and `lastPendingTime` represent the range of
  pending work. (Previously, "pending" was the same as "not suspended.")
- A *suspended* level is work that did not complete because data was
  missing. `firstSuspendedTime` and `lastSuspendedTime` represent the
  range of suspended work. It is a subset of the pending range. (These
  fields are new to this commit.)
- `nextAfterSuspendedTime` represents the next known level that comes
  after the suspended range.

This commit doesn't change much in terms of observable behavior. The one
change is that, when a level is suspended, React will continue working
on the next known level instead of jumping straight to the last pending
level. Subsequent commits will use this new structure for a more
substantial refactor for how tasks are scheduled per root.

* Get next expiration time from FiberRoot

Given a FiberRoot, we should be able to determine the next expiration
time that needs to be worked on, taking into account the levels that
are pending, suspended, pinged, and so on.

This removes the `expirationTime` argument from
`scheduleCallbackForRoot`, and renames it to `ensureRootIsScheduled` to
reflect the new signature. The expiration time is instead read from the
root using a new function, `getNextExpirationTimeToWorkOn`.

The next step will be to remove the `expirationTime` argument from
`renderRoot`, too.

* Don't bind expiration time to render callback

This is a fragile pattern because there's only meant to be a single
task per root, running at a single expiration time. Instead of binding
the expiration time to the render task, or closing over it, we should
determine the correct expiration time to work on using fields we
store on the root object itself.

This removes the "return a continuation" pattern from the
`renderRoot` function. Continuation handling is now handled by
the wrapper function, which I've renamed from `runRootCallback` to
`performWorkOnRoot`. That function is merely an entry point to
`renderRoot`, so I've also removed the callback argument.

So to sum up, at at the beginning of each task, `performWorkOnRoot`
determines which expiration time to work on, then calls `renderRoot`.
And before exiting, it checks if it needs to schedule another task.

* Update error recovery test to match new semantics

* Remove `lastPendingTime` field

It's no longer used anywhere

* Restart on update to already suspended root

If the work-in-progress root already suspended with a delay, then the
current render definitely won't finish. We should interrupt the render
and switch to the incoming update.

* Restart on suspend if return path has an update

Similar to the previous commit, if we suspend with a delay, and
something in the return path has a pending update, we should abort
the current render and switch to the update instead.

* Track the next unprocessed level globally

Instead of backtracking the return path. The main advantage over the
backtracking approach is that we don't have to backtrack from the source
fiber. (The main disadvantages are that it requires another module-level
variable, and that it could include updates from unrelated
sibling paths.)

* Re-arrange slightly to prevent refactor hazard

It should not be possible to perform any work on a root without
calling `ensureRootIsScheduled` before exiting. Otherwise, we could
fail to schedule a callback for pending work and the app could freeze.

To help prevent a future refactor from introducing such a bug, this
change makes it so that `renderRoot` is always wrapped in try-finally,
and the `finally` block calls `ensureRootIsScheduled`.

* Remove recursive calls to `renderRoot`.

There are a few leftover cases where `renderRoot` is called recursively.
All of them are related to synchronously flushing work before its
expiration time.

We can remove these calls by tracking the last expired level on the
root, similar to what we do for other types of pending work, like pings.

* Remove argument from performSyncWorkOnRoot

Read the expiration time from the root, like we do
in performConcurrentWorkOnRoot.
acdlite added a commit to acdlite/react that referenced this pull request Sep 12, 2019
The stack of PRs in facebook#16743 was reverted. This adds them back.
acdlite added a commit to acdlite/react that referenced this pull request Sep 13, 2019
The stack of PRs in facebook#16743 was reverted. This adds them back.
acdlite added a commit that referenced this pull request Sep 13, 2019
The stack of PRs in #16743 was reverted. This adds them back.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants