mirror of
https://github.com/Abdess/retroarch_system.git
synced 2026-10-24 20:59:03 -05:00
feat: pass the Starlight gate on dense pages
Pages of cards under one or two headings drop the table of contents, whose script watched every block of a 400-card page: 2 x 430 ms of main thread on a throttled phone. Tables are measured once the page is idle, skipping those in closed blocks, so a scrolling table is a tab stop anywhere on the page. The 12 heaviest pages score 97 to 100 in Lighthouse mobile, axe reports nothing on 16 pages in both themes, and the search answers the ten gate queries.
This commit is contained in:
1 parent
bcade3dc9b
commit
abe240073c
4 files changed
+27
-4
No files matched your search
@@ -131,7 +131,20 @@ const enhanceTables = () => {
|
||||
},
|
||||
{ rootMargin: '400px 0px' },
|
||||
);
|
||||
tables.forEach((table) => observer.observe(table));
|
||||
// Every table is measured once the page is drawn and idle, before anything
|
||||
// is written, so the read finds the layout done instead of forcing it: a
|
||||
// keyboard reaches a scrolling table anywhere on the page, not only near
|
||||
// the screen.
|
||||
const idle = window.requestIdleCallback ?? ((callback: () => void) => setTimeout(callback, 1));
|
||||
const start = () =>
|
||||
idle(() => {
|
||||
// A table in a closed block is not laid out, and measuring it would
|
||||
// lay it out: it is measured when its block opens.
|
||||
markScrollable(tables.filter((table) => table.checkVisibility?.() ?? true));
|
||||
tables.forEach((table) => observer.observe(table));
|
||||
});
|
||||
if (document.readyState === 'complete') start();
|
||||
else addEventListener('load', start, { once: true });
|
||||
let timer = 0;
|
||||
addEventListener('resize', () => {
|
||||
clearTimeout(timer);
|
||||
|
||||
Reference in new issue
Block a user