Scrolling is very slow on Android device on a site with typekit fonts
Categories
(Core :: Performance: General, defect)
Tracking
()
Webcompat Priority | ? |
People
(Reporter: ksenia, Unassigned)
References
()
Details
As reported here:
https://github.com/webcompat/web-bugs/issues/35163
Steps to reproduce:
On Android device:
Go to https://www.corsair.com/us/en/Categories/Products/Cases/Mid-Tower-ATX-Cases/Obsidian-Series%E2%84%A2-550D-Mid-Tower-Quiet-Case/p/CC-9011015-WW and try to scroll the page
Expected:
Pages scrolls
Actual:
Page doesn't scroll
This is reproducible in Nightly and release Firefox and not in Chrome. The device I was testing with is Samsung S5.
There is an expensive js function looping through each node on every scroll attempt:
function ha(a) {
a = document.createTreeWalker(a, NodeFilter.SHOW_ELEMENT, null, !1);
var b = [
];
do {
var c = a.currentNode;
if (c && 'SCRIPT' !== c.nodeName && 'STYLE' !== c.nodeName && 'NOSCRIPT' !== c.nodeName && 'TEMPLATE' !== c.nodeName && 'LINK' !== c.nodeName && 'TITLE' !== c.nodeName) {
for (var d = c.childNodes, e = 0; e < d.length; e++) d[e].nodeType !== Node.TEXT_NODE || /^\s*$/.test(d[e].nodeValue) || b.push(d[e].nodeValue);
'INPUT' === c.nodeName && 'hidden' !== c.type && 'password' !== c.type && b.push(c.value);
'TEXTAREA' === c.nodeName && b.push(c.value)
}
} while (a.nextNode());
a = b.join('');
b = new m;
for (c = 0; c < a.length; c++) d = a.charCodeAt(c),
55296 === (d & 63488) && c < a.length ? (e = a.charCodeAt(c + 1), 56320 === (e & 64512) ? b.b.push(((d & 1023) << 10) + (e & 1023) + 65536) : b.b.push(d), c++) : b.b.push(d);
return r(b)
};
From this file https://use.typekit.net/psg2bgx.js
Comment 1•6 years ago
|
||
Hmm, scrolling should be happening asynchronously using APZ and not be prevented by slow JavaScript. Maybe there's something else that inhibits scrolling? Is there a touch event listener that prevents async scrolling?
Reporter | ||
Comment 2•6 years ago
|
||
Thanks for pointing that out. There is an ontouchmove event listener with preventDefault in it
document.ontouchmove = function (e) {
e.preventDefault();
}
In Chrome this event on document
is being treated as passive, so calls to preventDefault are ignored and scrolling does work.
I guess I'll close this bug since it's not related to performance.
Description
•