From 968270ed486a3f8330520b95b142908758ad8bd7 Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Wed, 17 Mar 2021 19:28:20 +0300 Subject: [PATCH] fix excessive CPU usage on linux chromium caused by animated SVG icons --- js/Article.js | 4 ++-- js/Headlines.js | 10 ++++++++-- themes/compact.css | 7 +++---- themes/compact_night.css | 7 +++---- themes/light.css | 7 +++---- themes/light/cdm.less | 6 ------ themes/light/tt-rss.less | 4 ++-- themes/night.css | 7 +++---- themes/night_blue.css | 7 +++---- 9 files changed, 27 insertions(+), 32 deletions(-) diff --git a/js/Article.js b/js/Article.js index 5f882a59f..16abfbfee 100644 --- a/js/Article.js +++ b/js/Article.js @@ -283,8 +283,8 @@ const Article = { row.setAttribute("data-content", row.getAttribute("data-content-original")); row.removeAttribute("data-content-original"); - row.querySelector(".content-inner").innerHTML = `
- + row.querySelector(".content-inner").innerHTML = `
+ ${__("Loading, please wait...")}
` } }, diff --git a/js/Headlines.js b/js/Headlines.js index 2e19d54f2..134bdad6d 100755 --- a/js/Headlines.js +++ b/js/Headlines.js @@ -533,8 +533,8 @@ const Headlines = {
${Article.renderNote(hl.id, hl.note)}
-
- +
+ ${__("Loading, please wait...")}
@@ -749,6 +749,9 @@ const Headlines = { hsp.id = "headlines-spacer"; } + // clear out hsp contents in case there's a power-hungry svg icon rotating there + hsp.innerHTML = ""; + dijit.byId('headlines-frame').domNode.appendChild(hsp); this.initHeadlinesMenu(); @@ -800,6 +803,9 @@ const Headlines = { hsp.id = "headlines-spacer"; } + // clear out hsp contents in case there's a power-hungry svg icon rotating there + hsp.innerHTML = ""; + c.domNode.appendChild(hsp); this.initHeadlinesMenu(); diff --git a/themes/compact.css b/themes/compact.css index f9799c9ae..62cdd0839 100644 --- a/themes/compact.css +++ b/themes/compact.css @@ -520,10 +520,10 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow { border: 1px solid transparent; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode { - opacity: 0; + display: none; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode.visible { - opacity: 1; + display: inline; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Feed .loadingNode { left: 2px; @@ -1059,8 +1059,7 @@ body.ttrss_main .dijitDialog #feed_add_spinner { width: 18px; height: 18px; } -body.ttrss_main .icon-three-dots, -.cdm .content-inner .icon-unpack-pending { +body.ttrss_main .icon-three-dots { width: 18px; height: 18px; vertical-align: middle; diff --git a/themes/compact_night.css b/themes/compact_night.css index a03aed92b..64e19c99c 100644 --- a/themes/compact_night.css +++ b/themes/compact_night.css @@ -520,10 +520,10 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow { border: 1px solid transparent; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode { - opacity: 0; + display: none; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode.visible { - opacity: 1; + display: inline; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Feed .loadingNode { left: 2px; @@ -1059,8 +1059,7 @@ body.ttrss_main .dijitDialog #feed_add_spinner { width: 18px; height: 18px; } -body.ttrss_main .icon-three-dots, -.cdm .content-inner .icon-unpack-pending { +body.ttrss_main .icon-three-dots { width: 18px; height: 18px; vertical-align: middle; diff --git a/themes/light.css b/themes/light.css index df2eae48f..dbe31763a 100644 --- a/themes/light.css +++ b/themes/light.css @@ -520,10 +520,10 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow { border: 1px solid transparent; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode { - opacity: 0; + display: none; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode.visible { - opacity: 1; + display: inline; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Feed .loadingNode { left: 2px; @@ -1059,8 +1059,7 @@ body.ttrss_main .dijitDialog #feed_add_spinner { width: 18px; height: 18px; } -body.ttrss_main .icon-three-dots, -.cdm .content-inner .icon-unpack-pending { +body.ttrss_main .icon-three-dots { width: 18px; height: 18px; vertical-align: middle; diff --git a/themes/light/cdm.less b/themes/light/cdm.less index 05f785cd3..4bb1c6064 100644 --- a/themes/light/cdm.less +++ b/themes/light/cdm.less @@ -208,12 +208,6 @@ } } - .content-inner { - .icon-unpack-pending { - &:extend(body.ttrss_main .icon-three-dots); - } - } - .content-inner .embed-responsive { overflow : hidden; padding-bottom : @embed-responsive-padding; diff --git a/themes/light/tt-rss.less b/themes/light/tt-rss.less index 8ae130d89..53ad04d5b 100644 --- a/themes/light/tt-rss.less +++ b/themes/light/tt-rss.less @@ -594,10 +594,10 @@ body.ttrss_main { border : 1px solid transparent; .loadingNode { - opacity : 0; + display : none; &.visible { - opacity : 1; + display : inline; } } diff --git a/themes/night.css b/themes/night.css index 138e362f8..663a49811 100644 --- a/themes/night.css +++ b/themes/night.css @@ -521,10 +521,10 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow { border: 1px solid transparent; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode { - opacity: 0; + display: none; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode.visible { - opacity: 1; + display: inline; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Feed .loadingNode { left: 2px; @@ -1060,8 +1060,7 @@ body.ttrss_main .dijitDialog #feed_add_spinner { width: 18px; height: 18px; } -body.ttrss_main .icon-three-dots, -.cdm .content-inner .icon-unpack-pending { +body.ttrss_main .icon-three-dots { width: 18px; height: 18px; vertical-align: middle; diff --git a/themes/night_blue.css b/themes/night_blue.css index cc0f113db..f8d0096f3 100644 --- a/themes/night_blue.css +++ b/themes/night_blue.css @@ -521,10 +521,10 @@ body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow { border: 1px solid transparent; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode { - opacity: 0; + display: none; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow .loadingNode.visible { - opacity: 1; + display: inline; } body.ttrss_main #feeds-holder #feedTree .dijitTreeNode .dijitTreeRow.Is_Feed .loadingNode { left: 2px; @@ -1060,8 +1060,7 @@ body.ttrss_main .dijitDialog #feed_add_spinner { width: 18px; height: 18px; } -body.ttrss_main .icon-three-dots, -.cdm .content-inner .icon-unpack-pending { +body.ttrss_main .icon-three-dots { width: 18px; height: 18px; vertical-align: middle;