Merge pull request #1120 from thelounge/xpaw/scroll-perf

Include trickery to reduce paints and improve performance
This commit is contained in:
Pavel Djundik 2017-06-20 13:18:06 +03:00 committed by GitHub
commit 2091a5b41b
2 changed files with 15 additions and 28 deletions

View File

@ -140,10 +140,6 @@ kbd {
.container {
margin: 80px auto;
max-width: 480px;
overflow: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
padding: 0 30px;
}
::-moz-placeholder {
@ -374,8 +370,7 @@ kbd {
}
#viewport.rt #chat .sidebar {
-webkit-transform: translate3d(180px, 0, 0);
transform: translate3d(180px, 0, 0);
right: -180px;
}
#sidebar {
@ -389,6 +384,10 @@ kbd {
width: 220px;
}
#viewport.menu-open #sidebar {
will-change: transform;
}
#sidebar button,
#sidebar .chan,
#sidebar .sign-out {
@ -764,6 +763,7 @@ kbd {
left: 0;
right: 0;
overflow: auto;
will-change: transform, scroll-position;
-webkit-overflow-scrolling: touch;
position: absolute;
}
@ -787,9 +787,7 @@ kbd {
position: absolute;
right: 0;
width: 180px;
transition: all .4s;
-webkit-transform: translateZ(0);
transform: translateZ(0);
transition: right .4s;
}
#chat .show-more {
@ -1164,6 +1162,7 @@ kbd {
bottom: 0;
overflow: auto;
overflow-x: hidden;
will-change: transform, scroll-position;
-webkit-overflow-scrolling: touch;
padding-bottom: 10px;
position: absolute;
@ -1850,11 +1849,6 @@ kbd {
margin-top: 60px !important;
}
#viewport.rt #chat .sidebar {
-webkit-transform: translate3d(-180px, 0, 0);
transform: translate3d(-180px, 0, 0);
}
#sidebar,
#footer {
left: -220px;
@ -1889,22 +1883,15 @@ kbd {
right: -180px;
}
#viewport.rt #chat .sidebar {
right: 0;
}
#chat .title:before {
display: none;
}
}
@media (min-width: 769px) {
#viewport {
-webkit-transform: none !important;
transform: none !important;
}
#viewport.menu-open {
transition: none;
}
}
@media (max-width: 479px) {
.container {
margin: 40px 0 !important;

View File

@ -23,7 +23,7 @@ module.exports = function slideoutMenu(viewport, menu) {
function onTouchStart(e) {
if (e.touches.length !== 1) {
onTouchEnd();
return false;
return;
}
var touch = e.touches.item(0);
@ -37,7 +37,7 @@ module.exports = function slideoutMenu(viewport, menu) {
touchStartTime = Date.now();
viewport.addEventListener("touchmove", onTouchMove);
viewport.addEventListener("touchend", onTouchEnd);
viewport.addEventListener("touchend", onTouchEnd, {passive: true});
}
}
@ -91,7 +91,7 @@ module.exports = function slideoutMenu(viewport, menu) {
menuIsMoving = false;
}
viewport.addEventListener("touchstart", onTouchStart);
viewport.addEventListener("touchstart", onTouchStart, {passive: true});
return {
disable: disableSlideout,