Skip to content

Refactor flexbox algorithm into smaller units#47

Closed
TimJentzsch wants to merge 30 commits intoDioxusLabs:mainfrom
TimJentzsch:43-refactor-flexbox-algorithm
Closed

Refactor flexbox algorithm into smaller units#47
TimJentzsch wants to merge 30 commits intoDioxusLabs:mainfrom
TimJentzsch:43-refactor-flexbox-algorithm

Conversation

@TimJentzsch
Copy link
Copy Markdown
Collaborator

@TimJentzsch TimJentzsch commented May 16, 2022

Objective

Fixes #43.

The algo.rs file and the compute_internal specifically is extremely complex and will be hard to maintain in the long run. It needs to be separated into smaller units to be easier to change, test and reason about.

Solution

  • The compute_internal function has been divided into multiple smaller functions.
    • Cache check
    • Constants computation
    • Step 1
    • Step 2
    • Step 3
    • Step 4 (missing?)
    • Step 5
    • Step 6
    • Step 7
    • Step 8
    • Step 9
    • Step 10 (missing)
    • Step 11
    • Step 12
    • Step 13
    • Step 14
    • Step 15
    • Step 16
  • #[allow(clippy::cognitive_complexity)] has been removed.
  • Each function is documented, referencing the flexbox specs (if applicable).
  • No functional changes have been made.
  • The benchmarks don't show any major performance regressions.

As this is going to be a rather large change, I opened this up as WIP PR. Feel free to give feedback continuously as I make changes, if you notice any bigger problems with my implementation already.

This will make it easier to pass them around to the functions implementing each step of the algorithm.
@TimJentzsch TimJentzsch changed the title 43 refactor flexbox algorithm Refactor flexbox algorithm into smaller units May 16, 2022
@alice-i-cecile alice-i-cecile added the code quality Make the code cleaner or prettier. label May 17, 2022
@alice-i-cecile
Copy link
Copy Markdown
Collaborator

This is an excellent PR description and process. I'm looking forward to seeing this develop :)

@TimJentzsch
Copy link
Copy Markdown
Collaborator Author

Wow, GitHub actions can inline errors in the PR diff? Awesome!
GitHub actions annotation in PR diff

@TimJentzsch TimJentzsch force-pushed the 43-refactor-flexbox-algorithm branch from f094fce to 6798052 Compare May 17, 2022 15:32
@TimJentzsch TimJentzsch force-pushed the 43-refactor-flexbox-algorithm branch from 57e840f to ec17845 Compare May 18, 2022 16:35
@TimJentzsch TimJentzsch force-pushed the 43-refactor-flexbox-algorithm branch from 820d8f4 to 53fe85a Compare May 19, 2022 09:01
@TimJentzsch TimJentzsch force-pushed the 43-refactor-flexbox-algorithm branch from a8dff70 to 3565790 Compare May 19, 2022 20:10
@TimJentzsch TimJentzsch force-pushed the 43-refactor-flexbox-algorithm branch from 1181506 to d584cb9 Compare May 21, 2022 10:44
@TimJentzsch
Copy link
Copy Markdown
Collaborator Author

While I don't think that we should merge this just yet, this PR is ready for an initial review pass.

I'm especially looking for feedback/ideas regarding the following:

  • Does this format of documentation work well?
  • Some functions are still rather long, should these be further split up? If yes, should this be done in this PR?
  • The algo.rs file is too long for my taste (and it will get longer in the future). Should we move some of the functions to another file, e.g. in an algo module folder?
  • Can you spot step 4 of the algorithm? I'm not sure if it's not implemented or just not documented explicitly.
  • Does passing the constants through the AlgoConstants struct work well or should I pass each field separately to the functions?
  • The benchmarks showed a performance regression of about 5%, but they seem to be quite noisy. Can you reproduce these results on your local machine? If yes, do you have any ideas on how to improve the performance?

Feel free to nitpick this PR, I think it's important that we create a good foundation here for future developments.

@TimJentzsch TimJentzsch marked this pull request as ready for review May 27, 2022 15:42
@IceSentry
Copy link
Copy Markdown

I did a quick pass and overall I like the direction of this PR. Adding actual links to the spec with the relevant section when it is mentioned is really nice. I also like passing the constants struct around.

I agree that the file is quite big, but after a quick review it's hard to tell what part could be extracted. I guess things like computing constants could be in a separate file.

I'm not familiar enough with what it does to confidently say it doesn't change any behavior though.

I wonder if it's possible to do some of that in a few separate PRs. Like for example, could you do a PR that focuses on improving the comments without doing anything else? This could help make it easier to review.

(for the record, I come from the bevy community)

@TimJentzsch
Copy link
Copy Markdown
Collaborator Author

Thank you for your feedback!

I thought that maybe the different "sections" of the flexbox specs could be in different files. But I'm not sure if it's good practice in Rust to split impl blocks up like that and some spec sections are also considerably bigger than others.

Separating the doc improvements and refactoring would be possible in theory, but the "new" comments are tailored to them being on a new function, it would be weird to add the section name to each comment when it's in a single function IMO.
I tried to keep actual code changes to a minimum, but you are right that it's not that easy to review. A potential solution would be to review by commit instead of all changes at once.
Another option would be to add unit tests to make sure that no functionality broke, now that we have everything in separate functions this would be feasible. But I'm not sure how easy it is to set up the proper conditions for each function and how long it would take. This would also make the PR even bigger.

@alice-i-cecile
Copy link
Copy Markdown
Collaborator

I would really like unit tests for this, but in a follow-up PR. I'll do a pass on this in the coming week, commit-by-commit :)

@Weibye
Copy link
Copy Markdown
Collaborator

Weibye commented May 28, 2022

  • Can you spot step 4 of the algorithm? I'm not sure if it's not implemented or just not documented explicitly.

Is this code somehow responsible for a non-spec-abiding variant of step 4?

My code-comprehension isn't good enough to see if that is actually the case, but there are no other candidates I see that could be implementing step 4

@Weibye
Copy link
Copy Markdown
Collaborator

Weibye commented May 28, 2022

Does this format of documentation work well?

Yes, this is better. It improves readability :)

@TimJentzsch
Copy link
Copy Markdown
Collaborator Author

  • Can you spot step 4 of the algorithm? I'm not sure if it's not implemented or just not documented explicitly.

Is this code somehow responsible for a non-spec-abiding variant of step 4?

My code-comprehension isn't good enough to see if that is actually the case, but there are no other candidates I see that could be implementing step 4

It definitely might be, as step 4 is about Determine the main size of the flex container

Copy link
Copy Markdown
Collaborator

@Weibye Weibye left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this looks good to me, it is much improved from what was :)

}
}

fn compute_internal(
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This now has a much clearer high-level overview, which makes it easier to follow what is happening. Great work!

@Weibye Weibye mentioned this pull request Jun 4, 2022
alice-i-cecile and others added 2 commits June 8, 2022 12:22
Co-authored-by: Andreas Weibye <[email protected]>
Co-authored-by: Andreas Weibye <[email protected]>
Copy link
Copy Markdown
Collaborator

@alice-i-cecile alice-i-cecile left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Less intimidating to review than I was afraid of! This is a sizable improvement, great work.

@alice-i-cecile
Copy link
Copy Markdown
Collaborator

@TimJentzsch this is failing due to two missing imports:

use crate::style::{Style, FlexDirection};

Github is hating me, so I can't easily make the changes myself. Once that's done this is ready to merge.

@TimJentzsch
Copy link
Copy Markdown
Collaborator Author

I'm on vacation right now but will get on that in a couple of days

@alice-i-cecile
Copy link
Copy Markdown
Collaborator

Sounds good. I'll see what I can do on my own then :)

@alice-i-cecile
Copy link
Copy Markdown
Collaborator

Merged as #88 :D

@TimJentzsch TimJentzsch deleted the 43-refactor-flexbox-algorithm branch June 9, 2022 10:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

code quality Make the code cleaner or prettier.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Refactor flexbox layout algorithm into multiple functions

4 participants