use requestAnimationFrame for search

This commit is contained in:
Mylloon 2024-12-12 17:14:39 +01:00
parent bf13da9178
commit 9b6d75b560
Signed by: Anri
GPG key ID: A82D63DFF8D1317F

View file

@ -92,31 +92,35 @@ const deepestNodeOpened = (path, options) => {
};
const searchFiles = (query, parent, currentFile) => {
const children = parent.querySelectorAll("li");
// Prevent blocking the main thread
requestAnimationFrame(() => {
const children = parent.querySelectorAll("li");
if (query === "") {
children.forEach((item) => {
item.style.display = "";
if (
item.classList.contains("directory") &&
!item.classList.contains("collapsed")
) {
item.classList.add("collapsed");
}
});
uncollapse(currentFile);
return;
}
for (const item of children) {
if (item.innerText.toLowerCase().includes(query.toLowerCase())) {
item.style.display = "";
uncollapse(item);
continue;
const normalizedQuery = query.toLowerCase().trim();
if (normalizedQuery === "") {
children.forEach((item) => {
item.style.display = "";
if (
item.classList.contains("directory") &&
!item.classList.contains("collapsed")
) {
item.classList.add("collapsed");
}
});
uncollapse(currentFile);
return;
}
item.style.display = "none";
}
for (const item of children) {
const matches = item.innerText.toLowerCase().includes(normalizedQuery);
if (matches) {
item.style.display = "";
uncollapse(item);
continue;
}
item.style.display = "none";
}
});
};
window.addEventListener("load", () => {