Просмотр исходного кода

perf(ui): batch changes in markPageAsRead

Instead of interleaving DOM read/write, collect all the items first, then
modify them. This has a small but noticeable performance impact, as
`classList.add` might triggers a style invalidation.
jvoisin 6 дней назад
Родитель
Сommit
f8171fe69f
1 измененных файлов с 4 добавлено и 4 удалено
  1. 4 4
      internal/ui/static/js/app.js

+ 4 - 4
internal/ui/static/js/app.js

@@ -578,10 +578,10 @@ function markPageAsReadAction() {
     const items = getVisibleEntries();
     const items = getVisibleEntries();
     if (items.length === 0) return;
     if (items.length === 0) return;
 
 
-    const entryIDs = items.map((element) => {
-        element.classList.add("item-status-read");
-        return parseInt(element.dataset.id, 10);
-    });
+    const entryIDs = items.map((element) => parseInt(element.dataset.id, 10));
+
+    // Batch DOM writes after all reads
+    items.forEach((element) => element.classList.add("item-status-read"));
 
 
     updateEntriesStatus(entryIDs, "read", () => {
     updateEntriesStatus(entryIDs, "read", () => {
         const element = document.querySelector(":is(a, button)[data-action=markPageAsRead]");
         const element = document.querySelector(":is(a, button)[data-action=markPageAsRead]");