Repository navigation
feat(core): apply horizontal margins on in-flow blocks - #37
Conversation
margin-left, margin-right and margin: 0 auto had no effect on canvas blocks, so a max-width layout sat at the left edge. Auto margins centre or push a block that has a width. Negative margins can reach into a parent's padding but stay inside the render box, so a background can't paint over the host app. Also corrects the CSS matrix (margin % isn't supported) and fixes a test that failed when its loop finished within one clock tick.
|
| Fixture | Budget (ms) | Median (ms) | P95 (ms) | |
|---|---|---|---|---|
| ❌ | simple_paragraph |
8 | 10 | 17 |
| ✅ | mixed_inline |
10 | 10 | 13 |
| ✅ | float_layout |
12 | 10 | 14 |
| ❌ | table_20_rows |
14 | 21 | 37 |
| ✅ | cjk_ruby |
14 | 6 | 7 |
| ❌ | large_article |
16 | 26 | 58 |
One or more fixtures exceeded the 16 ms budget.
Flutter
3.41.5· ubuntu-22.04
Informational, does not block merge: CI runners use software
rendering and are 2-3x slower than the devices the budgets are
calibrated for. Compare against the base branch; if a fixture
regressed relative to it, profile with:
flutter test benchmark/layout_regression.dart --reporter expandedand check _performLineLayout / _buildCharacterMapping for
any new O(N²) or O(N log N) paths introduced in this PR.
- Floats sat at the render box edge, outside an inset or centred block, so text didn't wrap beside them. They now sit inside their containing block. - A <pre> used the full box width at its inset, so it could overflow or leave the box. It now fits inside the insets. - Inline !important invalidated values, so margin:auto !important didn't centre. - em margins used the root font size. - In RTL, a block with a width anchors to the right edge. - A flex container's canvas background ignored the margins its widget applies. - Max intrinsic width ignored block padding and margins, so IntrinsicWidth hosts wrapped text. - The performance monitor test now does real work instead of asserting >= 0.
|
| Fixture | Budget (ms) | Median (ms) | P95 (ms) | |
|---|---|---|---|---|
| ❌ | simple_paragraph |
8 | 17 | 25 |
| ❌ | mixed_inline |
10 | 15 | 16 |
| ❌ | float_layout |
12 | 19 | 27 |
| ❌ | table_20_rows |
14 | 46 | 72 |
| ✅ | cjk_ruby |
14 | 10 | 13 |
| ❌ | large_article |
16 | 52 | 87 |
One or more fixtures exceeded the 16 ms budget.
Flutter
3.41.5· ubuntu-22.04
Informational, does not block merge: CI runners use software
rendering and are 2-3x slower than the devices the budgets are
calibrated for. Compare against the base branch; if a fixture
regressed relative to it, profile with:
flutter test benchmark/layout_regression.dart --reporter expandedand check _performLineLayout / _buildCharacterMapping for
any new O(N²) or O(N log N) paths introduced in this PR.
margin-left,margin-rightandmargin: 0 autohad no effect on in-flow blocks, so amax-widthlayout sat at the left edge. This became more visible once #36 made backgrounds followwidth.auto: centres, or pushes, a block that has awidth,max-widthormin-width.Also corrects the CSS matrix (
margin%isn't supported) and fixes the flakyperformance_monitor_test.Tests:
test/block_margin_test.dart, measuring fragment geometry and pixels. Goldens match a baseline generated locally frommain.