Skip to content

Commit 131e98f

Browse files
crisbetoandrewseguin
authored andcommitted
perf(drawer): drawer content repainting on scroll (#7719)
Prevents the drawer content from repainting while scrolling. Relates to #7716.
1 parent 9b4f435 commit 131e98f

File tree

1 file changed

+4
-0
lines changed

1 file changed

+4
-0
lines changed

src/lib/sidenav/drawer.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
@import '../core/style/variables';
22
@import '../core/style/elevation';
33
@import '../core/style/layout-common';
4+
@import '../core/style/vendor-prefixes';
45
@import '../../cdk/a11y/a11y';
56

67
$mat-drawer-content-z-index: 1;
@@ -79,6 +80,9 @@ $mat-drawer-over-drawer-z-index: 4;
7980
}
8081

8182
.mat-drawer-content {
83+
// `backface-visibility` prevents the element from repainting on scroll. This is the
84+
// equivalent of using `translateZ(0)`, but it doesn't create a new stacking context.
85+
@include backface-visibility(hidden);
8286
@include mat-drawer-stacking-context($mat-drawer-content-z-index);
8387

8488
display: block;

0 commit comments

Comments
 (0)