Skip to content

Commit

Permalink
Minor display: contents optimizations (#1736)
Browse files Browse the repository at this point in the history
Summary:

X-link: facebook/react-native#47358

`LayoutableChildren<yoga::Node>::Iterator` showed up to a surprising extent on a recent trace. Part of this was during pixel grid rounding, which does full tree traversal (we should fix that...), where the iterator is the first thing to read from the node.

I ran Yoga microbenchmark with Yoga compiled with `-O2`, where we saw a regression of synthetic performance by ~10%, but it turns out this build also had ASAN and some other heavy bits enabled, so the real impact was quite lower (~6%).

I was able to make some optimizations in the meantime against that, which still show some minor wins, reducing that overhead to ~4% in the properly optimized build (and a bit more before that). This is still measurable on the beefy server, and the code is a bit cleaner, so let's commit these!

This change makes a few different optimizations
1. Removes redundant copies
2. Removes redundant index keeping
3. Mark which branches are likely vs unlikely
4. Shrink iterator size from 6 pointers to 3 pointers
5. Avoid usage in pixel grid rounding (so we don't need to have cache read for style)

In "Huge nested layout" example

| Before display: contents support | After display: contents support | After optimizations |
| 9.84ms | 10.39ms | 10.23ms |

Changelog: [Internal]

Differential Revision: D65336148
  • Loading branch information
NickGerleman authored and facebook-github-bot committed Nov 1, 2024
1 parent 6fed4df commit dab6486
Show file tree
Hide file tree
Showing 5 changed files with 27 additions and 37 deletions.
2 changes: 1 addition & 1 deletion yoga/algorithm/CalculateLayout.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -540,7 +540,7 @@ static float computeFlexBasisForChildren(
const uint32_t generationCount) {
float totalOuterFlexBasis = 0.0f;
YGNodeRef singleFlexChild = nullptr;
const auto& children = node->getLayoutChildren();
auto children = node->getLayoutChildren();
SizingMode sizingModeMainDim =
isRow(mainAxis) ? widthSizingMode : heightSizingMode;
// If there is only one child with flexGrow + flexShrink it means we can set
Expand Down
22 changes: 9 additions & 13 deletions yoga/algorithm/FlexLine.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,7 @@ FlexLine calculateFlexLine(
float totalFlexGrowFactors = 0.0f;
float totalFlexShrinkScaledFactors = 0.0f;
size_t numberOfAutoMargins = 0;
size_t endOfLineIndex = iterator.index();
size_t firstElementInLineIndex = iterator.index();
yoga::Node* firstElementInLine = nullptr;

float sizeConsumedIncludingMinConstraint = 0;
const Direction direction = node->resolveDirection(ownerDirection);
Expand All @@ -40,33 +39,31 @@ FlexLine calculateFlexLine(
const float gap =
node->style().computeGapForAxis(mainAxis, availableInnerMainDim);

const auto childrenEnd = node->getLayoutChildren().end();
// Add items to the current line until it's full or we run out of items.
for (; iterator != node->getLayoutChildren().end();
iterator++, endOfLineIndex = iterator.index()) {
for (; iterator != childrenEnd; iterator++) {
auto child = *iterator;
if (child->style().display() == Display::None ||
child->style().positionType() == PositionType::Absolute) {
if (firstElementInLineIndex == endOfLineIndex) {
// We haven't found the first contributing element in the line yet.
firstElementInLineIndex++;
}
continue;
}

if (firstElementInLine == nullptr) {
firstElementInLine = child;
}

if (child->style().flexStartMarginIsAuto(mainAxis, ownerDirection)) {
numberOfAutoMargins++;
}
if (child->style().flexEndMarginIsAuto(mainAxis, ownerDirection)) {
numberOfAutoMargins++;
}

const bool isFirstElementInLine =
(endOfLineIndex - firstElementInLineIndex) == 0;

child->setLineIndex(lineCount);
const float childMarginMainAxis =
child->style().computeMarginForAxis(mainAxis, availableInnerWidth);
const float childLeadingGapMainAxis = isFirstElementInLine ? 0.0f : gap;
const float childLeadingGapMainAxis =
child == firstElementInLine ? 0.0f : gap;
const float flexBasisWithMinAndMaxConstraints =
boundAxisWithinMinAndMax(
child,
Expand Down Expand Up @@ -117,7 +114,6 @@ FlexLine calculateFlexLine(
return FlexLine{
.itemsInFlow = std::move(itemsInFlow),
.sizeConsumed = sizeConsumed,
.endOfLineIndex = endOfLineIndex,
.numberOfAutoMargins = numberOfAutoMargins,
.layout = FlexLineRunningLayout{
totalFlexGrowFactors,
Expand Down
3 changes: 0 additions & 3 deletions yoga/algorithm/FlexLine.h
Original file line number Diff line number Diff line change
Expand Up @@ -49,9 +49,6 @@ struct FlexLine {
// the flexible children.
const float sizeConsumed{0.0f};

// The index of the first item beyond the current line.
const size_t endOfLineIndex{0};

// Number of edges along the line flow with an auto margin.
const size_t numberOfAutoMargins{0};

Expand Down
2 changes: 1 addition & 1 deletion yoga/algorithm/PixelGrid.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@ void roundLayoutResultsToPixelGrid(
Dimension::Height);
}

for (yoga::Node* child : node->getLayoutChildren()) {
for (yoga::Node* child : node->getChildren()) {
roundLayoutResultsToPixelGrid(child, absoluteNodeLeft, absoluteNodeTop);
}
}
Expand Down
35 changes: 16 additions & 19 deletions yoga/node/LayoutableChildren.h
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,12 @@
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

#pragma once

#include <cstdint>
#include <vector>
#include <forward_list>
#include <utility>

#include <yoga/enums/Display.h>

Expand All @@ -18,7 +20,6 @@ class Node;
template <typename T>
class LayoutableChildren {
public:
using Backtrack = std::vector<std::pair<const T*, size_t>>;
struct Iterator {
using iterator_category = std::input_iterator_tag;
using difference_type = std::ptrdiff_t;
Expand All @@ -30,18 +31,13 @@ class LayoutableChildren {

Iterator(const T* node, size_t childIndex)
: node_(node), childIndex_(childIndex) {}
Iterator(const T* node, size_t childIndex, Backtrack&& backtrack)
: node_(node),
childIndex_(childIndex),
backtrack_(std::move(backtrack)) {}

T* operator*() const {
return node_->getChild(childIndex_);
}

Iterator& operator++() {
next();
currentNodeIndex_++;
return *this;
}

Expand All @@ -51,10 +47,6 @@ class LayoutableChildren {
return tmp;
}

size_t index() const {
return currentNodeIndex_;
}

friend bool operator==(const Iterator& a, const Iterator& b) {
return a.node_ == b.node_ && a.childIndex_ == b.childIndex_;
}
Expand All @@ -68,16 +60,16 @@ class LayoutableChildren {
if (childIndex_ + 1 >= node_->getChildCount()) {
// if the current node has no more children, try to backtrack and
// visit its successor
if (backtrack_.empty()) {
if (backtrack_.empty()) [[likely]] {
// if there are no nodes to backtrack to, the last node has been
// visited
*this = Iterator{};
} else {
// pop and restore the latest backtrack entry
const auto back = backtrack_.back();
backtrack_.pop_back();
const auto& back = backtrack_.front();
node_ = back.first;
childIndex_ = back.second;
backtrack_.pop_front();

// go to the next node
next();
Expand All @@ -87,7 +79,10 @@ class LayoutableChildren {
++childIndex_;
// skip all display: contents nodes, possibly going deeper into the
// tree
skipContentsNodes();
if (node_->getChild(childIndex_)->style().display() ==
Display::Contents) [[unlikely]] {
skipContentsNodes();
}
}
}

Expand All @@ -99,7 +94,7 @@ class LayoutableChildren {
// if it has display: contents set, it shouldn't be returned but its
// children should in its place push the current node and child index
// so that the current state can be restored when backtracking
backtrack_.push_back({node_, childIndex_});
backtrack_.push_front({node_, childIndex_});
// traverse the child
node_ = currentNode;
childIndex_ = 0;
Expand All @@ -117,8 +112,7 @@ class LayoutableChildren {

const T* node_{nullptr};
size_t childIndex_{0};
size_t currentNodeIndex_{0};
Backtrack backtrack_;
std::forward_list<std::pair<const T*, size_t>> backtrack_;

friend LayoutableChildren;
};
Expand All @@ -133,7 +127,10 @@ class LayoutableChildren {
Iterator begin() const {
if (node_->getChildCount() > 0) {
auto result = Iterator(node_, 0);
result.skipContentsNodes();
if (node_->getChild(0)->style().display() == Display::Contents)
[[unlikely]] {
result.skipContentsNodes();
}
return result;
} else {
return Iterator{};
Expand Down

0 comments on commit dab6486

Please sign in to comment.