Commit Graph

5 Commits

Author SHA1 Message Date
Samuel Susla 50f2dd9cce Make layout event asynchronous unbatched
Summary:
Changelog: [internal]

Making "layout" event asynchronous unbatched will bring the behaviour closer to Paper.
Paper puts "layout" event in the event queue from ShadowQueue and schedules a flush of event queue on JavaScript queue.

Before this, Fabric puts "layout" event in the event queue from JavaScript queue, waits until main run loop is about to go to sleep and then schedules a flush of event queue on JavaScript thread.

Now Fabric no longer waits for main run loop to go to sleep but induces a flush of event queue on JavaScript thread right away.

Reviewed By: JoshuaGross, shergin

Differential Revision: D25849468

fbshipit-source-id: 366e99364507f7bc1d09325c04a604bcb2043e3d
2021-01-10 16:21:05 -08:00
Valentin Shergin 934275f931 Fabric: Changeing debouncing logic of onLayout event
Summary:
This changes the way we throttle `onLayout` events in Fabric.

The approach we used before has several issues:
* Every event-dispatching action initiated a lambda scheduled on JavaScript thread (which is a bit inefficient).
* If an event had {0,0,0,0} frame, it might be skipped because this is the default frame value.
* An event was always delivered by the exact block scheduled at the moment of the event initiation (even though some other blocks might be called before). In case of events being initiated rapidly, it can delay actual event delivery and maybe even overwhelm the JavaScript thread.

The new implementation uses a different approach: we maintain the shared storage with recent frame value and use the very first opportunity to deliver it. Alse see comments in the code.

Changelog: [Internal] Fabric-specific internal change.

Reviewed By: sammy-SC

Differential Revision: D25676336

fbshipit-source-id: 275b08990f7c5cf1f05a8f954ebc795a14e10ec2
2021-01-04 15:02:32 -08:00
Valentin Shergin 306a8adade Fabric: Using shared pointer for event counter in ViewEventEmitter
Summary:
The callback `dispatchEvent` is called asynchronously on the JavaScript thread, so all data it uses must be copied to the lambda. To work around this constraint we use a shared pointer for the counter.

Changelog: [Internal] Fabric-specific internal change.

Reviewed By: sammy-SC

Differential Revision: D24598840

fbshipit-source-id: fb5581858d54dc806863caf0c7c4f612ed6046e2
2020-10-28 19:48:10 -07:00
Joshua Gross ee38751975 Layout Events: throttle layout events sent to same node repeatedly
Summary:
Under Fabric only, we can enter an infinite layout loop where the emitted layout event oscillates between two height values that are off by a very small amount.

The cause is, in part, components that use layoutEvents to determine their dimensions: for example, using onLayout event "height" parameters to determine the height of a child. If the onLayout height changes rapidly, the child's height will change, causing another layout, ad infinitum.

This might seem like an extreme case but there are product use-cases where this is done in non-Fabric and layout stabilizes quickly. In Fabric, currently it may never stabilize.

Part of this is due to a longstanding issue that exists in Fabric and non-Fabric, that we cannot immediately fix: If in a single frame, C++ emits 100 layout events to ReactJS, ReactJS may only process 50 before committing the root. That will trigger more layout events, even though product code has only partially processed the layout events. At the next frame, the next 50 events will be processed which may again change the layout, emitting more events... etc. In most cases the tree will converge and layout values will stabilize, but in extreme cases in Fabric, it might not.

Part of this is because Fabric does not drop *stale* layout events. If 10 layout events are dispatched to the same node, it will process all 10 events in older. Non-Fabric does not have this behavior, so we're changing Fabric to drop stale events when they queue up.

Changelog: [Internal]

Reviewed By: sammy-SC

Differential Revision: D23719494

fbshipit-source-id: e44a3b3e40585b59680299db3a4efdc63cdf0de8
2020-09-17 13:20:23 -07:00
David Vacca 3093010ea5 move fabric to ReactCommon/react/renderer
Summary:
This diff moves fabric C++ code from ReactCommon/fabric to ReactCommon/react/renderer
As part of this diff I also refactored components, codegen and callsites on CatalystApp, FB4A and venice

Script: P137350694

changelog: [internal] internal refactor

Reviewed By: fkgozali

Differential Revision: D22852139

fbshipit-source-id: f85310ba858b6afd81abfd9cbe6d70b28eca7415
2020-07-31 13:34:29 -07:00