profile
viewpoint
Andrew Clark acdlite @facebook Redwood City, CA React core at Facebook. Hi!

acdlite/flummox 1697

Minimal, isomorphic Flux.

acdlite/json-sass 90

Transforms a JSON stream into scss syntax Sass.

acdlite/flummox-isomorphic-demo 89

Demo of how to create isomorphic apps using Flummox and react-router

acdlite/jquery.sidenotes 66

Transform Markdown footnotes into superpowered sidenotes

acdlite/change-emitter 50

Listen for changes. Like an event emitter that only emits a single event type. Really tiny.

acdlite/flpunx 34

Better than all the other Flux libraries combined!

acdlite/flummox-immutable-store 17

Flummox store with Immutable.js support for serialization and undo/redo

acdlite/bash-dotfiles 5

.files, including ~/.osx — sensible hacker defaults for OS X

acdlite/andrewphilipclark.com 4

My personal website/blog

acdlite/create-react-app 4

Create React apps with no build configuration.

push eventfacebook/react

Andrew Clark

commit sha 18de3b6e7c8a93289d9df67339d876bba6ff3e0c

Bug: Spawning hydration in response to Idle update (#19011) * Bug: Spawning hydration in response to Idle update Adds a test that fails in the new fork. * Fix typos related to Idle priority These are just silly mistakes that weren't caught by any of our tests. There's a lot of duplication in the Lanes module right now. It's also not super stable as we continue to refine our heuristics. Hopefully the final state is simpler and less prone to these types of mistakes.

view details

push time in 10 hours

PR merged facebook/react

Bug: Spawning hydration in response to Idle update CLA Signed React Core Team

Fixes a bug in the new fork when hydrating in response to an idle priority update.

The root cause isn't super interesting. Just silly mistakes that I made while iterating on the Lanes module, and that weren't caught by any of our tests.

There's a lot of duplication in the Lanes module right now. It's also not super stable as we continue to refine our heuristics. Hopefully the final state is simpler and harder to mess up.

+76 -1

4 comments

2 changed files

acdlite

pr closed time in 10 hours

push eventacdlite/react

Andrew Clark

commit sha 9273e6585fba9d66901c29b2c4eaed1b5af52f2c

Disable DevTools build job to unblock master (#19012)

view details

Andrew Clark

commit sha 15ca2ae2267bef7575a20f7a3e6cfb365e7e5991

Bug: Spawning hydration in response to Idle update Adds a test that fails in the new fork.

view details

Andrew Clark

commit sha a7755568f7fff98cf2edc47de6aca205dd0adab4

Fix typos related to Idle priority These are just silly mistakes that weren't caught by any of our tests. There's a lot of duplication in the Lanes module right now. It's also not super stable as we continue to refine our heuristics. Hopefully the final state is simpler and less prone to these types of mistakes.

view details

push time in 10 hours

push eventfacebook/react

Andrew Clark

commit sha 9273e6585fba9d66901c29b2c4eaed1b5af52f2c

Disable DevTools build job to unblock master (#19012)

view details

push time in 10 hours

PR merged facebook/react

Disable DevTools build job to unblock master CLA Signed React Core Team
+4 -3

3 comments

1 changed file

acdlite

pr closed time in 10 hours

PR opened facebook/react

Disable DevTools build job to unblock master
+4 -3

0 comment

1 changed file

pr created time in 10 hours

create barnchacdlite/react

branch : disable-devtools-build-job

created branch time in 10 hours

push eventacdlite/react

Andrew Clark

commit sha 4f5f6f9c5cf4dc40d70e8f3a9518745f58cf0b39

Fix typos related to Idle priority These are just silly mistakes that weren't caught by any of our tests. There's a lot of duplication in the Lanes module right now. It's also not super stable as we continue to refine our heuristics. Hopefully the final state is simpler and less prone to these types of mistakes.

view details

push time in 11 hours

PR opened facebook/react

Reviewers
Bug: Spawning hydration in response to Idle update

Fixes a bug in the new fork when hydrating in response to an idle priority update.

The root cause isn't super interesting. Just silly mistakes that I made while iterating on the Lanes module, and that weren't caught by any of our tests.

There's a lot of duplication in the Lanes module right now. It's also not super stable as we continue to refine our heuristics. Hopefully the final state is simpler and harder to mess up.

+74 -0

0 comment

1 changed file

pr created time in 11 hours

create barnchacdlite/react

branch : idle-hydration-bug

created branch time in 11 hours

push eventfacebook/react

Andrew Clark

commit sha 03e6b8ba2fb1c2820d2a5286701ff2b40590b438

Make LegacyHidden match semantics of old fork (#18998) Facebook currently relies on being able to hydrate hidden HTML. So skipping those trees is a regression. We don't have a proper solution for this in the new API yet. So I'm reverting it to match the old behavior. Now the server renderer will treat LegacyHidden the same as a fragment, with no other special behavior. We can only get away with this because we assume that every instance of LegacyHidden is accompanied by a host component wrapper. In the hidden mode, the host component is given a `hidden` attribute, which ensures that the initial HTML is not visible. To support the use of LegacyHidden as a true fragment, without an extra DOM node, we will have to hide the initial HTML in some other way.

view details

push time in a day

PR merged facebook/react

Make LegacyHidden match semantics of old fork CLA Signed React Core Team

Facebook currently relies on being able to hydrate hidden HTML. So skipping those trees is a regression.

We don't have a proper solution for this in the new API yet. So I'm reverting it to match the old behavior.

Now the server renderer will treat LegacyHidden the same as a fragment, with no other special behavior. We can only get away with this because we assume that every instance of LegacyHidden is accompanied by a host component wrapper. In the hidden mode, the host component is given a hidden attribute, which ensures that the initial HTML is not visible. To support the use of LegacyHidden as a true fragment, without an extra DOM node, we will have to hide the initial HTML in some other way.

+63 -40

3 comments

4 changed files

acdlite

pr closed time in a day

PR opened facebook/react

Reviewers
Make LegacyHidden match semantics of old fork

Facebook currently relies on being able to hydrate hidden HTML. So skipping those trees is a regression.

We don't have a proper solution for this in the new API yet. So I'm reverting it to match the old behavior.

Now the server renderer will treat LegacyHidden the same as a fragment, with no other special behavior. We can only get away with this because we assume that every instance of LegacyHidden is accompanied by a host component wrapper. In the hidden mode, the host component is given a hidden attribute, which ensures that the initial HTML is not visible. To support the use of LegacyHidden as a true fragment, without an extra DOM node, we will have to hide the initial HTML in some other way.

+63 -40

0 comment

4 changed files

pr created time in 2 days

push eventacdlite/react

Andrew Clark

commit sha 5b0eab606ecd771052e7587ebde9001f76e3be47

Make LegacyHidden match semantics of old fork Facebook currently relies on being able to hydrate hidden HTML. So skipping those trees is a regression. We don't have a proper solution for this in the new API yet. So I'm reverting it to match the old behavior. Now the server renderer will treat LegacyHidden the same as a fragment, with no other special behavior. We can only get away with this because we assume that every instance of LegacyHidden is accompanied by a host component wrapper. In the hidden mode, the host component is given a `hidden` attribute, which ensures that the initial HTML is not visible. To support the use of LegacyHidden as a true fragment, without an extra DOM node, we will have to hide the initial HTML in some other way.

view details

push time in 2 days

create barnchacdlite/react

branch : legacyhidden-hydration

created branch time in 2 days

push eventacdlite/react

Andrew Clark

commit sha 6407baf87eddb4322168b44a8fcbc0a2cb0a7221

Add LegacyHidden to server renderer When the tree is hidden, the server renderer renders nothing. The contents will be completely client rendered. When the tree is visible it acts like a fragment. The future streaming server renderer may want to pre-render these trees and send them down in chunks, as with Suspense boundaries.

view details

Andrew Clark

commit sha cae8137ea8aeffe211789038374db884f709ce2c

Force client render, even at Offscreen pri

view details

push time in 2 days

push eventacdlite/react

Andrew Clark

commit sha 0fb747f368635933f27d296be96c8edcf99cbdbc

Add LegacyHidden to server renderer (#18919) * Add LegacyHidden to server renderer When the tree is hidden, the server renderer renders nothing. The contents will be completely client rendered. When the tree is visible it acts like a fragment. The future streaming server renderer may want to pre-render these trees and send them down in chunks, as with Suspense boundaries. * Force client render, even at Offscreen pri

view details

Sophie Alpert

commit sha 21dc41c3205b4f721ba97d2e54f1d3b5c38cb79a

Simplify logic for mutable workInProgressSources (#18920) isPrimaryRenderer is always constant for a given React build, so these two arrays do nothing.

view details

Ricky Vetter

commit sha 121af3143c7164a196420b080cb31d0ef07d5dff

Update inaccurate mapChildren comment (#18931) The function you provide will only be passed a child and an index. It will not be passed a key. This is confirmed in the source, the Flow types, and the jsdoc comments.

view details

Nick Reiley

commit sha 7c080902ef4ad7b061c0377ee72d0a343cf42ea5

[DevTools] Improve HOC search UX (#18802) Co-authored-by: Brian Vaughn <brian.david.vaughn@gmail.com>

view details

Nick Reiley

commit sha dd2e36df33194ddd37844507dc6a88e0906df516

Profiler: Skip reading element for imported data (#18913) * skip reading element for imported data * rename nodes & enable store lookup for components tab * replace names * Added some more test coverage; reverted rename Co-authored-by: Brian Vaughn <bvaughn@fb.com>

view details

Brian Vaughn

commit sha 8dba6691d047c6b420b6b73bec6251914cd9fbba

Updated DevTools CHANGELOG for upcoming changes

view details

Gabriele Prestifilippo

commit sha 6ed5c2243f8a1d5983373d2865bd0b935f026f9e

Add MIT license to use-subscription package (#18927) This package is missing the license attribute (or a license file). Being a sub-package of React, it should get the same license, however, none was specified. A scan with `license_checker` would recognize this as `UNKNOWN`.

view details

Sebastian Silbermann

commit sha c390ab3643612dc08ca4bebadc5b0377e9e7eb79

Add test for displayName on React.memo components (#18925) * Add test for displayName on React.memo components * Added extra memo displayName test Co-authored-by: Brian Vaughn <brian.david.vaughn@gmail.com>

view details

Nick Reiley

commit sha 081b565cd7397290a1418a0765004bf83e9a23f8

[DevTools] enable Electron interactions on Linux & auto copy script tags (#18772) Co-authored-by: Brian Vaughn <brian.david.vaughn@gmail.com>

view details

Nick Reiley

commit sha d897c35ecfb7471b55e41933fd4d993b98dbf600

[DevTools] Add Component Highlighting to Profiler (#18745) Co-authored-by: Moji Izadmehr <m.eezadmehr@gmail.com> Co-authored-by: Brian Vaughn <bvaughn@fb.com>

view details

Brian Vaughn

commit sha 23309eb386777ee229cfb6f9b70fcb7c7123388b

DevTools 4.6.0 -> 4.7.0

view details

Toru Kobayashi

commit sha dbf2bba632a693df5a6c6becf1640c360bfb96c7

remove an unused ISSUE_TEMPLATE.md (#18953)

view details

Brian Vaughn

commit sha 5aa967b69b255ede89c03dda8cd617b61c492cdb

DevTools editable props tweaks (#18954) 1. Made non-editable prop text higher contrast (easier to read) 2. Also makes it stand out as different from dimmer placeholder text for "new prop"

view details

Andrew Clark

commit sha 95ea8ed47c8a92dd72d43349cdd2f12e6b48292a

LegacyHidden: mode that defers without hiding (#18958) Need this to unblock www. Not sure yet how we'll support this properly long term. While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

view details

Andrew Clark

commit sha 8b3b5c35245b3aa0b2802b51856fe9dad5bcb671

Bugfix: Missing mode check in resetChildLanes (#18961) Deferring a hidden tree is only supported in Concurrent Mode. The missing check leads to an infinite loop when an update is scheduled inside a hidden tree, because the pending work never gets reset. This "accidentally" worked in the old reconciler because the heurstic we used to detect offscreen trees was if `childExpirationTime` was `Never`. In the new reconciler, we check the tag instead. Which means we also need to check the mode, like we do in the begin phase. We should move this check out of the hot path. It shouldn't have been in the hot path of the old reconciler, either. Probably by moving `resetChildLanes` into the switch statement in ReactFiberCompleteWork.

view details

Sebastian Markbåge

commit sha a30a1c6ef3a621a57e9372c8249439dbfd9a7375

Transfer actualDuration only once for SuspenseList (#18959)

view details

Andrew Clark

commit sha 64f50c667a778c85dc8f1d56e26d881fada4c85a

Remove disableHiddenPropDeprioritization flag (#18964) This is rolled out to 100% public, so we can remove it.

view details

Brian Vaughn

commit sha 22f7663f14f12ebd6174292931e94d2b352cf666

Profiler: Don't count timed out (hidden) subtrees in base duration (#18966)

view details

Dominic Gannaway

commit sha 4a3f779d67d7d7f69cb2340c788826b86b34ce05

Remove event pooling in the modern system (#18969)

view details

Andrew Clark

commit sha f9bf828701e7ba430da45d86f11fde2f93cbc491

Add `unstable_isNewReconciler export to FB builds (#18974) Should check this at runtime instead of the GK

view details

push time in 2 days

push eventfacebook/react

Andrew Clark

commit sha 74394aa8cbb7a1c18c34018b099a9b5ab10ef11c

Add unstable_isNewReconciler to dispatcher (#18975) This is a bit gross but I need to be able to access it without importing the renderer. There might be a better way but I need this to unblock internal bugfix.

view details

push time in 6 days

PR merged facebook/react

Add unstable_isNewReconciler to dispatcher CLA Signed React Core Team

This is a bit gross but I need to be able to access it without importing the renderer.

There might be a better way but I need this to unblock an internal bugfix.

+51 -1

0 comment

3 changed files

acdlite

pr closed time in 6 days

PR opened facebook/react

Add unstable_isNewReconciler to dispatcher

This is a bit gross but I need to be able to access it without importing the renderer.

There might be a better way but I need this to unblock an internal bugfix.

+51 -1

0 comment

3 changed files

pr created time in 6 days

create barnchacdlite/react

branch : is-new-reconciler-dispatcher

created branch time in 6 days

push eventfacebook/react

Andrew Clark

commit sha f9bf828701e7ba430da45d86f11fde2f93cbc491

Add `unstable_isNewReconciler export to FB builds (#18974) Should check this at runtime instead of the GK

view details

push time in 6 days

PR merged facebook/react

Add `unstable_isNewReconciler` export to FB builds CLA Signed React Core Team

Should check this at runtime instead of the GK

+9 -1

3 comments

4 changed files

acdlite

pr closed time in 6 days

PR opened facebook/react

Reviewers
Add `unstable_isNewReconciler` export to FB builds

Should check this at runtime instead of the GK

+9 -1

0 comment

4 changed files

pr created time in 6 days

create barnchacdlite/react

branch : is-new-reconciler

created branch time in 6 days

push eventfacebook/react

Andrew Clark

commit sha 64f50c667a778c85dc8f1d56e26d881fada4c85a

Remove disableHiddenPropDeprioritization flag (#18964) This is rolled out to 100% public, so we can remove it.

view details

push time in 7 days

PR merged facebook/react

Reviewers
Remove disableHiddenPropDeprioritization flag CLA Signed React Core Team

This is rolled out to 100% public, so we can remove it.

+3 -22

3 comments

10 changed files

acdlite

pr closed time in 7 days

PR opened facebook/react

Reviewers
Remove disableHiddenPropDeprioritization flag

This is rolled out to 100% public, so we can remove it.

+3 -22

0 comment

10 changed files

pr created time in 7 days

create barnchacdlite/react

branch : remove-disable-hidden-flag

created branch time in 7 days

push eventfacebook/react

Andrew Clark

commit sha 8b3b5c35245b3aa0b2802b51856fe9dad5bcb671

Bugfix: Missing mode check in resetChildLanes (#18961) Deferring a hidden tree is only supported in Concurrent Mode. The missing check leads to an infinite loop when an update is scheduled inside a hidden tree, because the pending work never gets reset. This "accidentally" worked in the old reconciler because the heurstic we used to detect offscreen trees was if `childExpirationTime` was `Never`. In the new reconciler, we check the tag instead. Which means we also need to check the mode, like we do in the begin phase. We should move this check out of the hot path. It shouldn't have been in the hot path of the old reconciler, either. Probably by moving `resetChildLanes` into the switch statement in ReactFiberCompleteWork.

view details

push time in 7 days

PR merged facebook/react

Reviewers
Bugfix: Missing mode check in resetChildLanes CLA Signed React Core Team

Deferring a hidden tree is only supported in Concurrent Mode.

The missing check leads to an infinite loop when an update is scheduled inside a hidden tree, because the pending work never gets reset.

This "accidentally" worked in the old reconciler because the heurstic we used to detect offscreen trees was if childExpirationTime was Never.

In the new reconciler, we check the tag instead. Which means we also need to check the mode, like we do in the begin phase.

We should move this check out of the hot path. It shouldn't have been in the hot path of the old reconciler, either.

Probably by moving resetChildLanes into the switch statement in ReactFiberCompleteWork.

+90 -1

3 comments

2 changed files

acdlite

pr closed time in 7 days

PR opened facebook/react

Reviewers
Bugfix: Missing mode check in resetChildLanes

Deferring a hidden tree is only supported in Concurrent Mode.

The missing check leads to an infinite loop when an update is scheduled inside a hidden tree, because the pending work never gets reset.

This "accidentally" worked in the old reconciler because the heurstic we used to detect offscreen trees was if childExpirationTime was Never.

In the new reconciler, we check the tag instead. Which means we also need to check the mode, like we do in the begin phase.

We should move this check out of the hot path. It shouldn't have been in the hot path of the old reconciler, either.

Probably by moving resetChildLanes into the switch statement in ReactFiberCompleteWork.

+90 -1

0 comment

2 changed files

pr created time in 7 days

create barnchacdlite/react

branch : missing-mode-check

created branch time in 7 days

push eventfacebook/react

Andrew Clark

commit sha 95ea8ed47c8a92dd72d43349cdd2f12e6b48292a

LegacyHidden: mode that defers without hiding (#18958) Need this to unblock www. Not sure yet how we'll support this properly long term. While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

view details

push time in 8 days

PR merged facebook/react

Reviewers
LegacyHidden: mode that defers without hiding CLA Signed React Core Team

Need this to unblock www. Not sure yet how we'll support this properly long term.

While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

+89 -3

4 comments

4 changed files

acdlite

pr closed time in 8 days

push eventacdlite/react

Andrew Clark

commit sha 684b977f8c71ab761a3c016d4b3a353b21eab9e5

LegacyHidden: mode that defers without hiding Need this to unblock www. Not sure yet how we'll support this properly long term. While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

view details

push time in 8 days

push eventacdlite/react

Andrew Clark

commit sha 3751365c75101f60df15d7f292364d5bc9cc1551

LegacyHidden: mode that defers without hiding Need this to unblock www. Not sure yet how we'll support this properly long term. While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

view details

push time in 8 days

push eventacdlite/react

Andrew Clark

commit sha ddef8c045f2a88b8dc2cc02b17d1848ac7017b5a

LegacyHidden: mode that defers without hiding Need this to unblock www. Not sure yet how we'll support this properly long term. While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

view details

push time in 8 days

PR opened facebook/react

Reviewers
LegacyHidden: mode that defers without hiding

Need this to unblock www. Not sure yet how we'll support this properly long term.

While adding this, I noticed that the normal "hidden" mode of LegacyHidden doesn't work properly because it doesn't toggle the visibility of newly inserted nodes. This is fine for now since we only use it via a userspace abstraction that wraps the children in an additional node. But implementing this correctly is required for us to start using it like a fragment, without the wrapper node.

+9 -3

0 comment

3 changed files

pr created time in 8 days

create barnchacdlite/react

branch : defer-without-hiding

created branch time in 8 days

pull request commentfacebook/react

Proof-of-concept: Express render phase in terms of generator functions

@chirgjn Yeah you can fork acdlite:generator-component

acdlite

comment created time in 9 days

pull request commentfacebook/react

Proof-of-concept: Express render phase in terms of generator functions

This is a rough idea of what I had in mind for the generator output. This is a first draft. I'll add more/better examples later.

Input:

let stack = [];
let threadLocalVariable = 'initial value';

export function* renderSomeComponent(
  current: Fiber | null,
  workInProgress: Fiber,
  renderLanes: Lanes,
): RenderStateMachine {
  const prevValueOnStack = threadLocalVariable;
  threadLocalVariable = 'override subtree with new value';
  try {
    const newChildren = newProps.children;
    reconcileChildren(current, workInProgress, newChildren, renderLanes);
    yield workInProgress.child;
  } finally {
    threadLocalVariable = overrideWithSomeVariable;
  }
}

Output:

let stack = [];
let threadLocalVariable = 'initial value';

function renderSomeComponent_0(current, workInProgress, renderLanes) {
  const prevValueOnStack = threadLocalVariable;
  threadLocalVariable = 'override subtree with new value';

  const newChildren = newProps.children;
  reconcileChildren(current, workInProgress, newChildren, renderLanes);
  
  const yieldedValue = workInProgress.child;

  // First slot is the continuation to use if the children render successfully
  // Second slot is if something throws
  stack.push(renderSomeComponent_1, renderSomeComponent_2);
  // Remaining slots are used for local variables
  stack.push(prevValueOnStack);

  return yieldedValue;
}

function renderSomeComponent_1(current, workInProgress, renderLanes) {
  // Load local variables
  const prevValueOnStack = stack[2];

  threadLocalVariable = prevValueOnStack;

  // Pop continuations
  array.pop();
  array.pop();

  // Pop local variables
  array.pop()
  return _context.finish(7);
}

function renderSomeComponent_2(current, workInProgress, renderLanes) {
  // Pop continuations
  array.pop();
  array.pop();

  // Pop local variables
  array.pop()
  return _context.stop();
}
acdlite

comment created time in 9 days

push eventacdlite/react

Andrew Clark

commit sha be85aeafd74ca5639672afbb84de580690dbf83b

Port provider context value to generator stack The value is only read by the provider component that overrides it, so this can be expressed as a local variable.

view details

push time in 9 days

PR opened facebook/react

Proof-of-concept: Express render phase in terms of generator functions

Combines all the sub-phases of the render phase — begin, complete, and unwind — into a single generator function.

It works by pushing/popping iterator functions onto a stack. This replaces the stack in ReactFiberStack.

The cursor objects used by ReactFiberStack are replaced by module level variables that are referenced via closure.

For our release builds, what we would do is compile the generator functions to normal, static functions that push/pop to the stack directly, skipping the overhead of the iterator objects.

The first one I've ported is Context providers.

+380 -223

0 comment

6 changed files

pr created time in 9 days

push eventacdlite/react

Andrew Clark

commit sha d55ceaa6c90c1d06d406d19d03b799d9610ef7a8

POC: Model render phase using generator functions Combines all the sub-phases of the render phase -- begin, complete, and unwind -- into a single generator function. It works by pushing/popping iterator functions onto a stack. This replaces the stack in ReactFiberStack. The cursor objects used by ReactFiberStack are replaced by module level variables that are referenced via closure. For our release builds, what we would do is compile the generator functions to normal, static functions that push/pop to the stack directly, skipping the overhead of the iterator objects. The first one I've ported is Context providers.

view details

push time in 9 days

push eventacdlite/react

Andrew Clark

commit sha 23c0f29908c0b07f0a1867e7f1fd34e7be4b1735

POC: Model render phase using generator functions Combines all the sub-phases of the render phase -- begin, complete, and unwind -- into a single generator function. It works by pushing/popping iterator functions onto a stack. This replaces the stack in ReactFiberStack. The cursor objects used by ReactFiberStack are replaced by module level variables that are referenced via closure. For our release builds, what we would do is compile the generator functions to normal, static functions that push/pop to the stack directly, skipping the overhead of the iterator objects. The first one I've ported is Context providers.

view details

push time in 9 days

create barnchacdlite/react

branch : generator-component

created branch time in 9 days

pull request commentfacebook/react

useMutableSource: Allow returning function from getSnapshot

Another option is to use useReducer instead. However, we have plans to fork the useState and useReducer implementations so we can optimize useState for simple cases that can quickly bail out. So that might not work longer term.

OTOH, we've talked about making it so useState won't support multiple priority levels; that is, if you update at multiple priorities, both of them will get batched together, because that allows us to eagerly compute the final value without worrying that the reducer might change (since it's always basicStateReducer). That trade off works best when the updates are local. Doesn't work as well when the updates are entangled with lots of other updates across the whole app, as would often be the case with Flux store-like sources that useMutableSource is designed for.

Regardless I still kinda prefer not supporting this and warning.

sophiebits

comment created time in 12 days

pull request commentfacebook/react

useMutableSource: Allow returning function from getSnapshot

Do we actually want to support this or is it more about defining a behavior that's currently poorly defined?

Using a function as your "snapshot" only works if it's pure/idempotent. It doesn't work if it reads from anything mutable (including the source itself).

I can't think of any legit use cases for this. Maybe to make an expensive computation lazy, but that's a subtle thing to get right because you have to pluck out the inputs before closing over them. I would consider that a very advanced use case, and there are other ways to get around it, like by wrapping the computation in an object: { readMemoizedComputation() }

As an alternative, could we say we don't support functions as snapshots and warn in dev if we detect one?

sophiebits

comment created time in 12 days

push eventfacebook/react

Andrew Clark

commit sha 0fb747f368635933f27d296be96c8edcf99cbdbc

Add LegacyHidden to server renderer (#18919) * Add LegacyHidden to server renderer When the tree is hidden, the server renderer renders nothing. The contents will be completely client rendered. When the tree is visible it acts like a fragment. The future streaming server renderer may want to pre-render these trees and send them down in chunks, as with Suspense boundaries. * Force client render, even at Offscreen pri

view details

push time in 13 days

PR merged facebook/react

Add LegacyHidden to server renderer CLA Signed React Core Team

I think this makes sense, but not entirely sure.

When the tree is hidden, the server renderer renders nothing. The contents will be completely client rendered.

When the tree is visible it acts like a fragment.

The future streaming server renderer may want to pre-render these trees and send them down in chunks, as with Suspense boundaries.

+110 -1

6 comments

3 changed files

acdlite

pr closed time in 13 days

pull request commentfacebook/react

Add LegacyHidden to server renderer

Hydration is normally only suppose to happen in lanes between other priorities (for the scheduler at higher pri case) which needs dedicated lanes. So I think it would make sense for the default hydration to have its own.

Makes sense to me. Started working on this but it's a slightly bigger change since I need to audit our use of OffscreenLane as a heuristic, which is subtle and easy to mess up. So I'd prefer to do that inn a follow up and land this PR as-is to fix the hydration warnings and unblock the internal rollout.

acdlite

comment created time in 13 days

push eventacdlite/react

Andrew Clark

commit sha cae8137ea8aeffe211789038374db884f709ce2c

Force client render, even at Offscreen pri

view details

push time in 13 days

push eventacdlite/react

Andrew Clark

commit sha 68d6eb7ba75cf38a0fd9b38b39d7ab4394e58288

Force client render, even at Offscreen pri

view details

push time in 13 days

pull request commentfacebook/react

Add LegacyHidden to server renderer

Hmm I think maybe this won't work if it hydrates at Offscreen priority, which would happen if it's nested inside a Suspense boundary.

acdlite

comment created time in 13 days

PR opened facebook/react

Reviewers
Add LegacyHidden to server renderer

I think this makes sense, but not entirely sure.

When the tree is hidden, the server renderer renders nothing. The contents will be completely client rendered.

When the tree is visible it acts like a fragment.

The future streaming server renderer may want to pre-render these trees and send them down in chunks, as with Suspense boundaries.

+71 -0

0 comment

2 changed files

pr created time in 13 days

create barnchacdlite/react

branch : ssr-legacyhidden

created branch time in 13 days

push eventfacebook/react

Andrew Clark

commit sha b4a1a4980c98c6d8a7ced428a1adc9e278fec430

Disable <div hidden /> API in old fork, too (#18917) The motivation for doing this is to make it impossible for additional uses of pre-rendering to sneak into www without going through the LegacyHidden abstraction. Since this feature was already disabled in the new fork, this brings the two closer to parity. The LegacyHidden abstraction itself still needs to opt into pre-rendering somehow, so rather than totally disabling the feature, I updated the `hidden` prop check to be obnoxiously specific. Before, you could set it to any truthy value; now, you must set it to the string "unstable-do-not-use-legacy-hidden". The node will still be hidden in the DOM, since any truthy value will cause the browser to apply a style of `display: none`. I will have to update the LegacyHidden component in www to use the obnoxious string prop. This doesn't block merge, though, since the behavior is gated by a dynamic flag. I will update the component before I enable the flag.

view details

push time in 13 days

PR merged facebook/react

Reviewers
Disable <div hidden /> API in old fork, too CLA Signed React Core Team

The motivation for doing this is to make it impossible for additional uses of pre-rendering to sneak into www without going through the LegacyHidden abstraction. Since this feature was already disabled in the new fork, this brings the two closer to parity.

The LegacyHidden abstraction itself still needs to opt into pre-rendering somehow, so rather than totally disabling the feature, I updated the hidden prop check to be obnoxiously specific. Before, you could set it to any truthy value; now, you must set it to the string "unstable-do-not-use-legacy-hidden".

The node will still be hidden in the DOM, since any truthy value will cause the browser to apply a style of display: none.

I will have to update the LegacyHidden component in www to use the obnoxious string prop. This doesn't block merge, though, since the behavior is gated by a dynamic flag. I will update the component before I enable the flag.

+38 -55

3 comments

15 changed files

acdlite

pr closed time in 13 days

push eventacdlite/react

Andrew Clark

commit sha cd78e484f6f88132c1a93e52de004146b6185c85

Disable <div hidden /> API in old fork, too The motivation for doing this is to make it impossible for additional uses of pre-rendering to sneak into www without going through the LegacyHidden abstraction. Since this feature was already disabled in the new fork, this brings the two closer to parity. The LegacyHidden abstraction itself still needs to opt into pre-rendering somehow, so rather than totally disabling the feature, I updated the `hidden` prop check to be obnoxiously specific. Before, you could set it to any truthy value; now, you must set it to the string "unstable-do-not-use-legacy-hidden". The node will still be hidden in the DOM, since any truthy value will cause the browser to apply a style of `display: none`. I will have to update the LegacyHidden component in www to use the obnoxious string prop. This doesn't block merge, though, since the behavior is gated by a dynamic flag. I will update the component before I enable the flag.

view details

push time in 13 days

push eventacdlite/react

Andrew Clark

commit sha ec8ad72de92289a5dec108e133fd90bd9c900e1c

Disable <div hidden /> API in old fork, too The motivation for doing this is to make it impossible for additional uses of pre-rendering to sneak into www without going through the LegacyHidden abstraction. Since this feature was already disabled in the new fork, this brings the two closer to parity. The LegacyHidden abstraction itself still needs to opt into pre-rendering somehow, so rather than totally disabling the feature, I updated the `hidden` prop check to be obnoxiously specific. Before, you could set it to any truthy value; now, you must set it to the string "unstable-do-not-use-legacy-hidden". The node will still be hidden in the DOM, since any truthy value will cause the browser to apply a style of `display: none`. I will have to update the LegacyHidden component in www to use the obnoxious string prop. This doesn't block merge, though, since the behavior is gated by a dynamic flag. I will update the component before I enable the flag.

view details

push time in 13 days

PR opened facebook/react

Reviewers
Disable <div hidden /> API in old fork, too

The motivation for doing this is to make it impossible for additional uses of pre-rendering to sneak into www without going through the LegacyHidden abstraction. Since this feature was already disabled in the new fork, this brings the two closer to parity.

The LegacyHidden abstraction itself still needs to opt into pre-rendering somehow, so rather than totally disabling the feature, I updated the hidden prop check to be obnoxiously specific. Before, you could set it to any truthy value; now, you must set it to the string "unstable-do-not-use-legacy-hidden".

The node will still be hidden in the DOM, since any truthy value will cause the browser to apply a style of display: none.

I will have to update the LegacyHidden component in www to use the obnoxious string prop. This doesn't block merge, though, since the behavior is gated by a dynamic flag. I will update the component before I enable the flag.

+41 -41

0 comment

15 changed files

pr created time in 13 days

create barnchacdlite/react

branch : disable-hidden-prop-api

created branch time in 13 days

push eventfacebook/react

Andrew Clark

commit sha fdb641629e82df6588c16e158978ac57d9aff9ba

Fix useMutableSource tearing bug (#18912) * Failing useMutableSource test If a source is mutated after initial read but before subscription is set up, it should still entangle all pending mutations even if snapshot of new subscription happens to match. Test case illustrates how not doing this can lead to tearing. * Fix useMutableSource tearing bug Fix is to move the entanglement call outside of the block that checks if the snapshot has changed.

view details

push time in 14 days

PR merged facebook/react

Fix useMutableSource tearing bug CLA Signed React Core Team

If a source is mutated after initial read but before subscription is set up, it should still entangle all pending mutations even if snapshot of new subscription happens to match.

Test case illustrates how not doing this can lead to tearing.

The fix is to move the entanglement call outside of the block that checks if the snapshot has changed.

+106 -15

5 comments

3 changed files

acdlite

pr closed time in 14 days

pull request commentfacebook/react

Fix useMutableSource tearing bug

Correct me if I'm wrong though, but this tearing case would still be possible for any source where version is not an auto-incremented value (e.g. window.location, maybe even Redux stores).

Yeah sounds right to me. Something to think about.

acdlite

comment created time in 14 days

push eventacdlite/react

Andrew Clark

commit sha c3c4c3f6f9d8e7ce3268a37828fb8343f5d3dad0

Fix useMutableSource tearing bug Fix is to move the entanglement call outside of the block that checks if the snapshot has changed.

view details

push time in 14 days

PR opened facebook/react

Reviewers
Fix useMutableSource tearing bug

If a source is mutated after initial read but before subscription is set up, it should still entangle all pending mutations even if snapshot of new subscription happens to match.

Test case illustrates how not doing this can lead to tearing.

The fix is to move the entanglement call outside of the block that checks if the snapshot has changed.

+95 -0

0 comment

1 changed file

pr created time in 14 days

create barnchacdlite/react

branch : ums-tearing-bug

created branch time in 14 days

push eventfacebook/react

Andrew Clark

commit sha 33589f7423fa498c97001898af730c461a1fdc7d

useMutableSource: "Entangle" instead of expiring (#18889) * useMutableSource: "Entangle" instead of expiring A lane is said to be entangled with another when it's not allowed to render in a batch that does not also include the other lane. This commit implements entanglement for `useMutableSource`. If a source is mutated in between when it's read in the render phase, but before it's subscribed to in the commit phase, we must account for whether the same source has pending mutations elsewhere. The old subscriptions must not be allowed to re-render without also including the new subscription (and vice versa), to prevent tearing. In the old reconciler, we did this by synchronously flushing all the pending subscription updates. This works, but isn't ideal. The new reconciler can entangle the updates without de-opting to sync. In the future, we plan to use this same mechanism for other features, like skipping over intermediate useTransition states. * Use clz instead of ctrz to pick an arbitrary lane Should be slightly faster since most engines have built-in support.

view details

push time in 14 days

PR merged facebook/react

useMutableSource: "Entangle" instead of expiring CLA Signed React Core Team

A lane is said to be entangled with another when it's not allowed to render in a batch that does not also include the other lane.

This commit implements entanglement for useMutableSource. If a source is mutated in between when it's read in the render phase, but before it's subscribed to in the commit phase, we must account for whether the same source has pending mutations elsewhere. The old subscriptions must not be allowed to re-render without also including the new subscription (and vice versa), to prevent tearing.

In the old reconciler, we did this by synchronously flushing all the pending subscription updates. This works, but isn't ideal. The new reconciler can entangle the updates without de-opting to sync.

In the future, we plan to use this same mechanism for other features, like skipping over intermediate useTransition states.

+107 -40

3 comments

6 changed files

acdlite

pr closed time in 14 days

Pull request review commentfacebook/react

useMutableSource: "Entangle" instead of expiring

 function useMutableSource<Source, Snapshot>(         markRootMutableRead(root, lane);          // If the source mutated between render and now,-        // there may be state updates already scheduled from the old getSnapshot.-        // Those updates should not commit without this value.-        // There is no mechanism currently to associate these updates though,-        // so for now we fall back to synchronously flushing all pending updates.-        // TODO: This should entangle the lanes instead of expiring everything.-        markRootExpired(root, root.mutableReadLanes);+        // there may be state updates already scheduled from the old source.+        // Entangle the updates so that they render in the same batch.+        // TODO: I think we need to entangle even if the snapshot matches,+        // because there could have been an update to a different hook.

Noticed this while updating the comment. I'll open a separate PR with a test and fix.

acdlite

comment created time in 14 days

push eventacdlite/react

Toru Kobayashi

commit sha 039ad34a059981b1ba972e205cea8347462cf492

deps: update ESLint version to v7 (#18897)

view details

Dominic Gannaway

commit sha 80c4dea0d1da0012977c6c4b2ac7a8bd37154d50

Modern Event System: Add scaffolding for createEventHandle (#18898)

view details

Dan Abramov

commit sha 14e554b3103cc009c86f48ed927f2552649600a6

Add missing changelog item

view details

Dan Abramov

commit sha 84fd4b853fd64651abf0b84f4ca879a9e43a106a

Revert "deps: update ESLint version to v7 (#18897)" (#18899) This reverts commit 039ad34a059981b1ba972e205cea8347462cf492.

view details

Dominic Gannaway

commit sha 61f2a560e0c5a0a7d218c52a1b74b3f3592acb9b

Add experimental ReactDOM.createEventHandle (#18756)

view details

Nick Reiley

commit sha a3fccd2567bfa154a4b2154ef14203999804e39b

Fix Profiler root change error (#18880)

view details

Dominic Gannaway

commit sha 6514e4a179d7f7759f5aca348477c1299a4235ad

React Flare: fix PressLegacy preventDefault issue (#18904)

view details

Boris Sergeev

commit sha 487c693846dbe58a68a410c658699d27386323b3

[eslint-plugin-react-hooks] useWithoutEffectSuffix fix (#18902) (#18907) * [eslint-plugin-react-hooks] reproduce bug with a test and fix it (#18902) Since we only reserve `-Effect` suffix, react-hooks/exhaustive-deps is expected to succeed without warning on a custom hook which contains -Effect- in the middle of it's name (but does NOT contain it as a suffix). * [eslint-plugin-react-hooks] reproduced bug with a test and fix it Since we only reserve `-Effect` suffix, react-hooks/exhaustive-deps is expected to succeed without warning on a render helper which contains -use- in the middle of it's name (but does NOT contain it as a prefix, since that would violate hook naming convetion). Co-authored-by: Boris Sergeyev <boris.sergeyev@quolab.com>

view details

Dan Abramov

commit sha f6ff4c43dde9f208dcd3d8d7115cfedb4f3b8aa5

Update changelog

view details

Dan Abramov

commit sha 43063fd8442c5dfa927b4cc423bae1bdbeac7132

eslint-plugin-react-hooks@4.0.2

view details

Andrew Clark

commit sha 41dceb4b8cf48179f13b883ba76de405112ba326

useMutableSource: "Entangle" instead of expiring A lane is said to be entangled with another when it's not allowed to render in a batch that does not also include the other lane. This commit implements entanglement for `useMutableSource`. If a source is mutated in between when it's read in the render phase, but before it's subscribed to in the commit phase, we must account for whether the same source has pending mutations elsewhere. The old subscriptions must not be allowed to re-render without also including the new subscription (and vice versa), to prevent tearing. In the old reconciler, we did this by synchronously flushing all the pending subscription updates. This works, but isn't ideal. The new reconciler can entangle the updates without de-opting to sync. In the future, we plan to use this same mechanism for other features, like skipping over intermediate useTransition states.

view details

Andrew Clark

commit sha e3aab985686893223adb66d6aa8c70fa09348f5d

Use clz instead of ctrz to pick an arbitrary lane Should be slightly faster since most engines have built-in support.

view details

push time in 14 days

push eventacdlite/react

Sebastian Markbåge

commit sha fd696df4729fb68cf5c3f1a8125524299a5892fc

Hard code enableComponentStacks in www (#18869) This is now fully rolled out.

view details

Sebastian Markbåge

commit sha 539527b642101fbfc0b4ba614d7e253905f46b08

Don't cut off effects at end of list if hydrating (#18872)

view details

Rohith Srivathsav

commit sha ddcc69c83b59ef0f895aa5020196e2ae9de36133

Added clear message for functional component starting with lowercase (#18881)

view details

Karl Horky

commit sha 2b9d7cf65fb5423a972b5dc920a3341b865085bf

Devtools: Show inspectedElement `key` in right pane (#18737) * Start MVP for showing inspected element key * Add key in other places * Add key from backend * Remove unnecessary hydrateHelper call * Hide copy button when no label * Move above props * Revert changes to InspectedElementTree.js * Move key to left of component name * Updated CSS Co-authored-by: Brian Vaughn <brian.david.vaughn@gmail.com>

view details

Dominic Gannaway

commit sha e16703e6c7776ff39e30c448df075f48bdbe08ea

Modern Event System: revise ancestor logic (#18886)

view details

Dominic Gannaway

commit sha ef0bf8e31cda331cbee4d3acf74e76795e311391

Revert "Hard code enableComponentStacks in www (#18869)" (#18890) This reverts commit fd696df4729fb68cf5c3f1a8125524299a5892fc.

view details

Andrew Clark

commit sha 8b9c4d1688333865e702fcd65ad2ab7d83b3c33c

Expose LegacyHidden type and disable <div hidden /> API in new fork (#18891) * Expose LegacyHidden type I will use this internally at Facebook to migrate away from <div hidden />. The end goal is to migrate to the Offscreen type, but that has different semantics. This is an incremental step. * Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations. * Add gated warning for `<div hidden />` API Only exists so we can detect callers in www and migrate them to the new API. Should not visible to anyone outside React Core team.

view details

Michaël De Boey

commit sha c3ff21e01bdf6269da222a3203392190d04de8d3

feat(eslint-plugin-react-hooks): Support ESLint 7.x (#18878)

view details

Dan Abramov

commit sha e936034eecf3d882cb133a11a1b4afd98d0195c5

Add item to ESLint Hooks plugin changelog

view details

Richard Maisano

commit sha c512aa008175f43315ad16cd9da86dc0c512c069

[Blocks] Scaffolding react-fetch + first pass at node implementation (#18863) * First pass at scaffolding out the Node implementation of react-data. While incomplete, this patch contains some changes to the react-data package in order to start adding support for Node. The first part of this change accounts for splitting react-data/fetch into two discrete entries, adding (and defaulting to) the Node implementation. The second part is sketching out a rough approximation of `fetch` for Node. This implementation is not complete by any means, but provides a starting point. * Remove NodeFetch module and put it directly into ReactDataFetchNode. * Replaced react-data with react-fetch. This patch shuffles around some of the scaffolding that was in react-data in favor of react-fetch. It also removes the additional "fetch" package in favor of something flatter. * Tweak package organization * Simplify and add a test Co-authored-by: Dan Abramov <dan.abramov@me.com>

view details

Dan Abramov

commit sha 9f396bdd5d64be4ba02f0e74e12b686b626c3f1d

eslint-plugin-react-hooks@4.0.1

view details

Andrew Clark

commit sha 75bb3ca61a78a5e0f3c1e4e76aec38a549f34099

useMutableSource: "Entangle" instead of expiring A lane is said to be entangled with another when it's not allowed to render in a batch that does not also include the other lane. This commit implements entanglement for `useMutableSource`. If a source is mutated in between when it's read in the render phase, but before it's subscribed to in the commit phase, we must account for whether the same source has pending mutations elsewhere. The old subscriptions must not be allowed to re-render without also including the new subscription (and vice versa), to prevent tearing. In the old reconciler, we did this by synchronously flushing all the pending subscription updates. This works, but isn't ideal. The new reconciler can entangle the updates without de-opting to sync. In the future, we plan to use this same mechanism for other features, like skipping over intermediate useTransition states.

view details

Andrew Clark

commit sha 98c5fccd70ea96f112a2ceb1b4c0491db1b0ab7f

Use clz instead of ctrz to pick an arbitrary lane Should be slightly faster since most engines have built-in support.

view details

push time in 15 days

push eventfacebook/react

Andrew Clark

commit sha 8b9c4d1688333865e702fcd65ad2ab7d83b3c33c

Expose LegacyHidden type and disable <div hidden /> API in new fork (#18891) * Expose LegacyHidden type I will use this internally at Facebook to migrate away from <div hidden />. The end goal is to migrate to the Offscreen type, but that has different semantics. This is an incremental step. * Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations. * Add gated warning for `<div hidden />` API Only exists so we can detect callers in www and migrate them to the new API. Should not visible to anyone outside React Core team.

view details

push time in 15 days

PR merged facebook/react

Reviewers
Expose LegacyHidden type and disable <div hidden /> API in new fork CLA Signed React Core Team

I will use this internally at Facebook to migrate away from <div hidden />. The end goal is to migrate to the Offscreen type, but that has different semantics. This is an incremental step.

I disabled <div hidden /> in the new fork and updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

+303 -69

3 comments

27 changed files

acdlite

pr closed time in 15 days

push eventacdlite/react

Andrew Clark

commit sha 599518dfc63f2401bb7c81a5f4a9311ff9a62607

Add gated warning for `<div hidden />` API Only exists so we can detect callers in www and migrate them to the new API. Should not visible to anyone outside React Core team.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha f8da8373fa5fdc1f03c7fe199cc84975dbe9a305

Add gated warning for `<div hidden />` API Only exists so we can detect callers in www and migrate them to the new API. Should not visible to anyone outside React Core team.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha d1817861ae66192afae2f256cfb6909acb74eba0

Add gated warning for `<div hidden />` API Only exists so we can detect callers in www and migrate them to the new API. Should not visible to anyone outside React Core team.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha b05776f10d8c6f4116e17a370856165836105919

Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

view details

push time in 15 days

Pull request review commentfacebook/react

Expose LegacyHidden type and disable <div hidden /> API in new fork

 function getTestFlags() {       classic: releaseChannel === 'classic',       www, +      // Using this more specific flag so it's easier to clean up later+      enableLegacyHiddenType:+        featureFlags.enableNewReconciler === false || __EXPERIMENTAL__,

Name is a bit misleading, but what this says is that the tests will pass if we're in the experimental branch of the new fork (because unstable_LegacyHidden is exposed) or if we're in the old fork (because the tests fall back to <div hidden /> in the old fork).

acdlite

comment created time in 15 days

push eventacdlite/react

Andrew Clark

commit sha 453b1fff72b287438753aef19175ac264ef2870e

Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha 179fc55f502f82b166932a466836bb38ddc70928

Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha c75f960106d5356b9adfcbe6f4c1955df1356f4d

Add gated warning for `<div hidden />` API Only exists so we can detect callers in www and migrate them to the new API. Should not visible to anyone outside React Core team.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha 2294abc44cc55836eb236c5dc1ff1d4a5cba5967

Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

view details

push time in 15 days

push eventacdlite/react

Andrew Clark

commit sha b65c4ba38073a05785a0b1dbce50ed569b9c7837

Disable <div hidden /> API in new fork Migrates to the unstable_LegacyHidden type instead. The old fork does not support the new component type, so I updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

view details

push time in 15 days

Pull request review commentfacebook/react

Expose LegacyHidden type and disable <div hidden /> API in new fork

 function updateHostComponent(    markRef(current, workInProgress); -  if (-    (workInProgress.mode & ConcurrentMode) !== NoMode &&-    nextProps.hasOwnProperty('hidden')-  ) {-    const wrappedChildren = {-      $$typeof: REACT_ELEMENT_TYPE,-      type: REACT_LEGACY_HIDDEN_TYPE,-      key: null,-      ref: null,-      props: {-        children: nextChildren,-        // Check the host config to see if the children are offscreen/hidden.-        mode: shouldDeprioritizeSubtree(type, nextProps) ? 'hidden' : 'visible',-      },-      _owner: __DEV__ ? {} : null,-    };-    nextChildren = wrappedChildren;+  if (__DEV__) {+    if (+      false &&

Oops, meant to move this into its own commit. One sec...

acdlite

comment created time in 15 days

PR opened facebook/react

Reviewers
Expose LegacyHidden type and disable <div hidden /> API in new fork

I will use this internally at Facebook to migrate away from <div hidden />. The end goal is to migrate to the Offscreen type, but that has different semantics. This is an incremental step.

I disabled <div hidden /> in the new fork and updated the tests to use an indirection that picks the correct API. I will remove this once the LegacyHidden (and/or Offscreen) type has landed in both implementations.

+256 -62

0 comment

16 changed files

pr created time in 15 days

create barnchacdlite/react

branch : legacy-hidden-type

created branch time in 15 days

Pull request review commentfacebook/react

useMutableSource: "Entangle" instead of expiring

 function useMutableSource<Source, Snapshot>(         // There is no mechanism currently to associate these updates though,         // so for now we fall back to synchronously flushing all pending updates.         // TODO: This should entangle the lanes instead of expiring everything.

I'll rewrite :)

acdlite

comment created time in 16 days

Pull request review commentfacebook/react

useMutableSource: "Entangle" instead of expiring

 export function getNextLanes(root: FiberRoot, wipLanes: Lanes): Lanes {     }   } +  // Check for entangled lanes and add them to the batch.+  //+  // A lane is said to be entangled with another when it's not allowed to render+  // in a batch that does not also include the other lane. Typically we do this+  // when multiple updates have the same source, and we only want to respond to+  // the most recent event from that source.+  //+  // Note that we apply entanglements *after* checking for partial work above.+  // This means that if a lane is entangled during an interleaved event while+  // it's already rendering, we won't interrupt it. This is intentional, since+  // entanglement is usually "best effort": we'll try our best to render the+  // lanes in the same batch, but it's not worth throwing out partially+  // completed work in order to do it.

For useMutableSource it's ok because the markRootEntangled call happens in the commit phase, where there's no partial work. I wrote this comment here as a reminder for the future.

The other case we have planned for entanglement is skipping intermediate useTransition updates, where you don't want to interrupt.

acdlite

comment created time in 16 days

Pull request review commentfacebook/react

useMutableSource: "Entangle" instead of expiring

 export function markRootFinished(root: FiberRoot, remainingLanes: Lanes) {   } } +export function markRootEntangled(root: FiberRoot, entangledLanes: Lanes) {+  root.entangledLanes |= entangledLanes;++  const entanglements = root.entanglements;+  let lanes = entangledLanes;+  while (lanes > 0) {+    const index = ctrz(lanes);+    const lane = 1 << index;++    entanglements[index] |= lanes;++    lanes &= ~lane;

Yeah I just noticed this while working on a PR on top. Good catch!

acdlite

comment created time in 16 days

push eventacdlite/react

Andrew Clark

commit sha 2f7fdff9a50afe391b879e366fce65a0cf8fd25b

useMutableSource: "Entangle" instead of expiring A lane is said to be entangled with another when it's not allowed to render in a batch that does not also include the other lane. This commit implements entanglement for `useMutableSource`. If a source is mutated in between when it's read in the render phase, but before it's subscribed to in the commit phase, we must account for whether the same source has pending mutations elsewhere. The old subscriptions must not be allowed to re-render without also including the new subscription (and vice versa), to prevent tearing. In the old reconciler, we did this by synchronously flushing all the pending subscription updates. This works, but isn't ideal. The new reconciler can entangle the updates without de-opting to sync. In the future, we plan to use this same mechanism for other features, like skipping over intermediate useTransition states.

view details

push time in 16 days

PR opened facebook/react

Reviewers
useMutableSource: "Entangle" instead of expiring

A lane is said to be entangled with another when it's not allowed to render in a batch that does not also include the other lane.

This commit implements entanglement for useMutableSource. If a source is mutated in between when it's read in the render phase, but before it's subscribed to in the commit phase, we must account for whether the same source has pending mutations elsewhere. The old subscriptions must not be allowed to re-render without also including the new subscription (and vice versa), to prevent tearing.

In the old reconciler, we did this by synchronously flushing all the pending subscription updates. This works, but isn't ideal. The new reconciler can entangle the updates without de-opting to sync.

In the future, we plan to use this same mechanism for other features, like skipping over intermediate useTransition states.

+94 -21

0 comment

6 changed files

pr created time in 16 days

create barnchacdlite/react

branch : entanglement

created branch time in 16 days

PR closed facebook/react

Out-of-band www sync CLA Signed React Core Team

Using this PR to run an out-of-band www sync. Not for merge.

Based off edf6eac8a181860fd8a2d076a43806f1237495a1, the currently synced revision.

Includes only https://github.com/facebook/react/pull/18864, which only affects the new fork. So it should be low risk.

+719 -130

3 comments

16 changed files

acdlite

pr closed time in 19 days

PR opened facebook/react

Detect and prevent render starvation, per lane (#18864)

Using this PR to run an out-of-band www sync. Not for merge.

Based off edf6eac8a181860fd8a2d076a43806f1237495a1, the currently synced revision.

Includes only https://github.com/facebook/react/pull/18864, which only affects the new fork. So it should be low risk.

+719 -130

0 comment

16 changed files

pr created time in 19 days

push eventacdlite/react

Nick Reiley

commit sha d2ef120089b46a92702cedfd06139f92ce2ca1bf

Allow Node 14.x (#18755)

view details

Brian Vaughn

commit sha ea2af878cc3fb139b0e08cf9bc4b2f4178429d69

Root API should clear non-empty roots before mounting (#18730) * Root API should clear non-empty roots before mounting Legacy render-into-subtree API removes children from a container before rendering into it. The root API did not do this previously, but just left the children around in the document. This commit adds a new FiberRoot flag to clear a container's contents before mounting. This is done during the commit phase, to avoid multiple, observable mutations.

view details

Dominic Gannaway

commit sha 88d0be6da5f0e3b57b010f852f90e603b38192da

Refactor ElementListenerMap (#18766)

view details

Dan Abramov

commit sha 53d68b33ff6ff6acd04b5a077fdc86627d319e08

[Blocks] Add Client Fixture (#18773) * [Blocks] Add Client Fixture * Add more TODOs

view details

Dan Abramov

commit sha 515326753b15eb247493b1b5c657eee1bc515337

[Blocks] Initial implementation of cache and data/fetch (#18774) * Rename ReactCache -> ReactCacheOld We still use it in some tests so I'm going to leave it for now. I'll start making the new one in parallel in the react package. * Add react/unstable-cache entry point * Add react-data entry point * Initial implementation of cache and data/fetch * Address review

view details

Alex Taylor

commit sha e71f5df9c32b3b486bf4efce861834389c395d47

Consistent useCallback implementation in ReactDOMServer (#18783)

view details

Dan Abramov

commit sha dd7f0deb947f836170cd1019dbbc2e44d30a21ce

[Blocks] Use native fetch (#18784) * [Blocks] Use native fetch * Use the prototype * Support arrayBuffer() and blob() * ctor * Simplify * Use an expando * Keep a map of formats * Unused * Remove unnecessary second property read * Keep it simple * Store the original thenable

view details

Dan Abramov

commit sha 3a9c373521eae259acbfcf98f0f9a543a6934c10

[Blocks] Add preload to fetch (#18785)

view details

Dan Abramov

commit sha 5b89d353e27a7ef07b40929f7343ebcc43bdaa58

Update react-refresh README

view details

Brian Vaughn

commit sha ac533fde3dff81023809a92d3f5432df7fc2c418

Prevent stale legacy root from clearing a container (DRAFT) (#18792) * Don't clear a container because of a stale legacy root * Added test repro for FB error

view details

Andrew Clark

commit sha 914b57be27a8697d8ed83266466b30378af379f0

Move legacy hidden API to new internal Fiber type (#18782) * Unhide Suspense trees without entanglement When a Suspense boundary is in its fallback state, you cannot switch back to the main content without also finishing any updates inside the tree that might have been skipped. That would be a form of tearing. Before we fixed this in #18411, the way this bug manifested was that a boundary was suspended by an update that originated from a child component (as opposed to props from a parent). While the fallback was showing, it received another update, this time at high priority. React would render the high priority update without also including the original update. That would cause the fallback to switch back to the main content, since the update that caused the tree to suspend was no longer part of the render. But then, React would immediately try to render the original update, which would again suspend and show the fallback, leading to a momentary flicker in the UI. The approach added in #18411 is, when receiving a high priority update to a Suspense tree that's in its fallback state is to bail out, keep showing the fallback and finish the update in the rest of the tree. After that commits, render again at the original priority. Because low priority expiration times are inclusive of higher priority expiration times, this ensures that all the updates are committed together. The new approach in this commit is to turn `renderExpirationTime` into a context-like value that lives on the stack. Then, when unhiding the Suspense boundary, we can push a new `renderExpirationTime` that is inclusive of both the high pri update and the original update that suspended. Then the boundary can be unblocked in a single render pass. An advantage of the old approach is that by deferring the work of unhiding, there's less work to do in the high priority update. The key advantage of the new approach is that it solves the consistency problem without having to entangle the entire root. * Create internal LegacyHidden type This only exists so we can clean up the internal implementation of `<div hidden={isHidden} />`, which is not a stable feature. The goal is to move everything to the new Offscreen type instead. However, Offscreen has different semantics, so before we can remove the legacy API, we have to migrate our internal usage at Facebook. So we'll need to maintain both temporarily. In this initial commit, I've only added the type. It's not used anywhere. The next step is to use it to implement `hidden`. * Use LegacyHidden to implement old hidden API If a host component receives a `hidden` prop, we wrap its children in an Offscreen fiber. This is similar to what we do for Suspense children. The LegacyHidden type happens to share the same implementation as the new Offscreen type, for now, but using separate types allows us to fork the behavior later when we implement our planned changes to the Offscreen API. There are two subtle semantic changes here. One is that the children of the host component will have their visibility toggled using the same mechanism we use for Offscreen and Suspense: find the nearest host node children and give them a style of `display: none`. We didn't used to do this in the old API, because the `hidden` DOM attribute on the parent already hides them. So with this change, we're actually "overhiding" the children. I considered addressing this, but I figure I'll leave it as-is in case we want to expose the LegacyHidden component type temporarily to ease migration of Facebook's internal callers to the Offscreen type. The other subtle semantic change is that, because of the extra fiber that wraps around the children, this pattern will cause the children to lose state: ```js return isHidden ? <div hidden={true} /> : <div />; ``` The reason is that I didn't want to wrap every single host component in an extra fiber. So I only wrap them if a `hidden` prop exists. In the above example, that means the children are conditionally wrapped in an extra fiber, so they don't line up during reconciliation, so they get remounted every time `isHidden` changes. The fix is to rewrite to: ```js return <div hidden={isHidden} />; ``` I don't anticipate this will be a problem at Facebook, especially since we're only supposed to use `hidden` via a userspace wrapper component. (And since the bad pattern isn't very React-y, anyway.) Again, the eventual goal is to delete this completely and replace it with Offscreen.

view details

Sophie Alpert

commit sha 21670cf4be2da872bf0403aba060208b5ec357df

[react-refresh/babel] Always insert registrations after var (#18794) Previously, we transformed ``` let Foo = styled.div``; ``` to ``` let Foo = _c1 = styled.div``; ``` and then babel-plugin-styled-components would infer `_c1` as the display name. Widen the existing case that applies to function expressions to apply to any type of variable declaration.

view details

Dan Abramov

commit sha 01914a767317e72ebb24c12bc83630a85f2163c4

Update bundle configs to not build some packages (#18800) * Stop building old ReactCache for FB * Update other bundle configs

view details

Dan Abramov

commit sha 43a1c727510b5f95c594ef88cfe431e9ad5c53c7

Don't build react-data for WWW

view details

Dan Abramov

commit sha 9491f394723e140259d65f4d2b8a4d869fa4ba62

react-refresh@0.8.2

view details

Sebastian Markbåge

commit sha 17dcc29cd1b53fe15b370631e1b781c070c01c7a

Don't "schedule" discrete work if we're scheduling sync work (#18797)

view details

Dan Abramov

commit sha eab94403d772798dd45a47ec607f069215b2c8ad

Build Flight runtime for WWW (revert part of earlier change)

view details

Aaron Pettengill

commit sha 5ac9ca72dfb73a06157bb177cd695f6b77fc900e

Feature: Add support to `exhaustive-deps` rule for any hook ending with `Effect` (#18580) * Add test cases for support exhaustive deps ending in Effect * Apply the exhaustive deps lint rule to any hook ending with Effect * Add another test for supporting linting useXEffect hooks Co-authored-by: Aaron Pettengill <aaron.pettengill@echoman.com>

view details

Dan Abramov

commit sha 4e93b9364c978fd0c1224f8008dd19f88a82a048

Add changelog for eslint-plugin-react-hooks (#18801)

view details

Dan Abramov

commit sha d804f99b9e4409a1d11212fb889450ab75243d5b

eslint-plugin-react-hooks@4.0.0

view details

push time in 19 days

push eventfacebook/react

Andrew Clark

commit sha 6edaf6f764f23043f0cd1c2da355b42f641afd8b

Detect and prevent render starvation, per lane (#18864) * Detect and prevent render starvation, per lane If an update is CPU-bound for longer than expected according to its priority, we assume it's being starved by other work on the main thread. To detect this, we keep track of the elapsed time using a fixed-size array where each slot corresponds to a lane. What we actually store is the event time when the lane first became CPU-bound. Then, when receiving a new update or yielding to the main thread, we check how long each lane has been pending. If the time exceeds a threshold constant corresponding to its priority, we mark it as expired to force it to synchronously finish. We don't want to mistake time elapsed while an update is IO-bound (waiting for data to resolve) for time when it is CPU-bound. So when a lane suspends, we clear its associated event time from the array. When it receives a signal to try again, either a ping or an update, we assign a new event time to restart the clock. * Store as expiration time, not start time I originally stored the start time because I thought I could use this in the future to also measure Suspense timeouts. (Event times are currently stored on each update object for this purpose.) But that won't work because in the case of expiration times, we reset the clock whenever the update becomes IO-bound. So to replace the per-update field, I'm going to have to track those on the room separately from expiration times.

view details

push time in 19 days

PR merged facebook/react

Reviewers
Detect and prevent render starvation, per lane CLA Signed React Core Team

If an update is CPU-bound for longer than expected according to its priority, we assume it's being starved by other work on the main thread.

To detect this, we keep track of the elapsed time using a fixed-size array where each slot corresponds to a lane. What we actually store is the event time when the lane first became CPU-bound. Changed it to store the expiration time, not the start time. See second commit for explanation.

Then, when receiving a new update or yielding to the main thread, we check how long each lane has been pending. If the time exceeds a threshold constant corresponding to its priority, we mark it as expired to force it to synchronously finish, instead of being interrupted again.

We don't want to mistake time elapsed while an update is IO-bound (waiting for data to resolve) for time when it is CPU-bound. So when a lane suspends, we clear its associated event time from the array. When it receives a signal to try again, either a ping or an update, we assign a new event time to restart the clock.

+719 -130

3 comments

16 changed files

acdlite

pr closed time in 19 days

more