CraftAttack/website
4
0
Fork 0
Code Issues 3 Pull Requests Actions Wiki Activity

increase pagination prefetch elements
All checks were successful
delpoy / build-and-deploy (push) Successful in 1m27s
Details

Browse Source
This commit is contained in:
bytedream 2024-11-28 02:13:35 +01:00
parent bd33727aa6
commit df91278db0
1 changed files with 29 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/lib/components/PaginationTable/PaginationTableBody.svelte
View File

@ -5,44 +5,45 @@
let bodyElem: HTMLTableSectionElement;
function intersectionViewer() {
let updating = false;
let intersectionElement =
bodyElem.rows.item(bodyElem.rows.length - 5) || bodyElem.lastElementChild;
let intersectionObserver: IntersectionObserver;
new IntersectionObserver(
async (entries, observer) => {
if (entries.filter((e) => e.isIntersecting).length === 0 || updating) return;
updating = true;
const rows = bodyElem.rows.length;
await onUpdate();
await tick();
observer.disconnect();
updating = false;
if (rows === bodyElem.rows.length) return;
intersectionViewer();
},
{ threshold: 1.0 }
).observe(intersectionElement!);
let intersectionElement;
function getIntersectionElement() {
intersectionElement =
bodyElem.rows.item(bodyElem.rows.length - 10) || bodyElem.lastElementChild;
}
onMount(async () => {
await onUpdate();
await tick();
new MutationObserver((entries) => {
if (entries.filter((e) => e.removedNodes.length > 0).length === 0) return;
intersectionObserver = new IntersectionObserver(
async (entries, observer) => {
if (entries.filter((e) => e.isIntersecting).length === 0 || !entries) return;
intersectionViewer();
const rows = bodyElem.rows.length;
await onUpdate();
await tick();
observer.unobserve(intersectionElement!);
if (rows === bodyElem.rows.length) return;
getIntersectionElement();
observer.observe(intersectionElement!);
},
{ threshold: 1.0 }
);
new MutationObserver((entries) => {
if (entries.filter((e) => e.removedNodes.length > 0).length === 0 || !entries) return;
intersectionObserver.unobserve(intersectionElement!);
getIntersectionElement();
intersectionObserver.observe(intersectionElement!);
}).observe(bodyElem, { childList: true });
intersectionViewer();
getIntersectionElement();
intersectionObserver.observe(intersectionElement!);
});
</script>