Skip to content

Commit

Permalink
perf(drawer): drawer content repainting on scroll
Browse files Browse the repository at this point in the history
Prevents the drawer content from repainting while scrolling.

Relates to angular#7716.
  • Loading branch information
crisbeto committed Oct 11, 2017
1 parent 9b07712 commit ed4c68c
Showing 1 changed file with 4 additions and 0 deletions.
4 changes: 4 additions & 0 deletions src/lib/sidenav/drawer.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
@import '../core/style/variables';
@import '../core/style/elevation';
@import '../core/style/layout-common';
@import '../core/style/vendor-prefixes';
@import '../../cdk/a11y/a11y';

$mat-drawer-content-z-index: 1;
Expand Down Expand Up @@ -79,6 +80,9 @@ $mat-drawer-over-drawer-z-index: 4;
}

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

display: block;
Expand Down

0 comments on commit ed4c68c

Please sign in to comment.