From 0c06bb5fe1278b7d92926b21b000e9c966e19ee6 Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Fri, 30 Nov 2018 14:20:00 +0300 Subject: [PATCH] scroll handler: performance improvements --- js/feedlist.js | 1 + js/viewfeed.js | 80 +++++++++++++++++++++----------------------------- 2 files changed, 35 insertions(+), 46 deletions(-) diff --git a/js/feedlist.js b/js/feedlist.js index 4aa70a361..78a125998 100644 --- a/js/feedlist.js +++ b/js/feedlist.js @@ -176,6 +176,7 @@ function feedlist_init() { document.onkeydown = hotkey_handler; setInterval(hotkey_prefix_timeout, 5*1000); + setInterval(catchupBatchedArticles, 3*1000); if (!getActiveFeedId()) { viewfeed({feed: -3}); diff --git a/js/viewfeed.js b/js/viewfeed.js index 072f6c9cb..6ae9cdd8a 100755 --- a/js/viewfeed.js +++ b/js/viewfeed.js @@ -1007,22 +1007,24 @@ function postMouseOut(id) { function unpackVisibleHeadlines() { if (!isCdmMode()) return; - $$("#headlines-frame div[id*=RROW][data-content]").each((row) => { - //console.log('checking', row.id); + const rows = $$("#headlines-frame div[id*=RROW][data-content]"); - if (row.offsetTop <= $("headlines-frame").scrollTop + $("headlines-frame").offsetHeight) { + for (let i = 0; i < rows.length; i++) { + const row = rows[i]; + + if (row.offsetTop <= $("headlines-frame").scrollTop + $("headlines-frame").offsetHeight) { console.log("unpacking: " + row.id); const content = row.getAttribute("data-content"); - row.select(".cdmContentInner")[0].innerHTML = content; + row.select(".cdmContentInner")[0].innerHTML = content; row.removeAttribute("data-content"); PluginHost.run(PluginHost.HOOK_ARTICLE_RENDERED_CDM, row); - } else { - throw $break; - } - }); + } else { + break; + } + } } function headlines_scroll_handler(e) { @@ -1035,8 +1037,6 @@ function headlines_scroll_handler(e) { _headlines_scroll_offset = e.scrollTop; - const hsp = $("headlines-spacer"); - unpackVisibleHeadlines(); // set topmost child in the buffer as active @@ -1046,18 +1046,18 @@ function headlines_scroll_handler(e) { const rows = $$("#headlines-frame > div[id*=RROW]"); for (let i = 0; i < rows.length; i++) { - const child = rows[i]; + const row = rows[i]; - if ($("headlines-frame").scrollTop <= child.offsetTop && - child.offsetTop - $("headlines-frame").scrollTop < 100 && - child.getAttribute("data-article-id") != _active_article_id) { + if ($("headlines-frame").scrollTop <= row.offsetTop && + row.offsetTop - $("headlines-frame").scrollTop < 100 && + row.getAttribute("data-article-id") != _active_article_id) { if (_active_article_id) { const row = $("RROW-" + _active_article_id); if (row) row.removeClassName("active"); } - _active_article_id = child.getAttribute("data-article-id"); + _active_article_id = row.getAttribute("data-article-id"); showArticleInHeadlines(_active_article_id, true); updateSelectedPrompt(); break; @@ -1066,6 +1066,8 @@ function headlines_scroll_handler(e) { } if (!_infscroll_disable) { + const hsp = $("headlines-spacer"); + if (hsp && hsp.offsetTop - 250 <= e.scrollTop + e.offsetHeight) { hsp.innerHTML = " " + @@ -1081,33 +1083,31 @@ function headlines_scroll_handler(e) { updateFloatingTitle(); } - catchupCurrentBatchIfNeeded(); - if (getInitParam("cdm_auto_catchup") == 1) { - // let's get DOM some time to settle down - const ts = new Date().getTime(); - if (ts - _last_headlines_update < 100) return; - - $$("#headlines-frame > div[id*=RROW][class*=Unread]").each( - function(child) { - if ($("headlines-frame").scrollTop > (child.offsetTop + child.offsetHeight/2)) { + let rows = $$("#headlines-frame > div[id*=RROW][class*=Unread]"); - const id = child.getAttribute("data-article-id") + for (let i = 0; i < rows.length; i++) { + const row = rows[i]; + + if ($("headlines-frame").scrollTop > (row.offsetTop + row.offsetHeight/2)) { - if (catchup_id_batch.indexOf(id) == -1) - catchup_id_batch.push(id); + const id = row.getAttribute("data-article-id") - //console.log("auto_catchup_batch: " + catchup_id_batch.toString()); - } + if (catchup_id_batch.indexOf(id) == -1) + catchup_id_batch.push(id); - }); + //console.log("auto_catchup_batch: " + catchup_id_batch.toString()); + } else { + break; + } + } if (_infscroll_disable) { - const child = $$("#headlines-frame div[id*=RROW]").last(); + const row = $$("#headlines-frame div[id*=RROW]").last(); - if (child && $("headlines-frame").scrollTop > - (child.offsetTop + child.offsetHeight - 50)) { + if (row && $("headlines-frame").scrollTop > + (row.offsetTop + row.offsetHeight - 50)) { console.log("we seem to be at an end"); @@ -1132,7 +1132,7 @@ function openNextUnreadFeed() { function catchupBatchedArticles() { if (catchup_id_batch.length > 0 && !_infscroll_request_sent && !_catchup_request_sent) { - console.log("catchupBatchedArticles: working"); + console.log("catchupBatchedArticles, size=", catchup_id_batch.length); // make a copy of the array const batch = catchup_id_batch.slice(); @@ -1150,7 +1150,6 @@ function catchupBatchedArticles() { const batch = reply.ids; batch.each(function (id) { - console.log(id); const elem = $("RROW-" + id); if (elem) elem.removeClassName("Unread"); catchup_id_batch.remove(id); @@ -1801,14 +1800,3 @@ function updateFloatingTitle(unread_only) { } } } - -function catchupCurrentBatchIfNeeded() { - if (catchup_id_batch.length > 0) { - window.clearTimeout(catchup_timeout_id); - catchup_timeout_id = window.setTimeout(catchupBatchedArticles, 1000); - - if (catchup_id_batch.length >= 10) { - catchupBatchedArticles(); - } - } -}