fix excessive CPU usage on linux chromium caused by animated SVG icons

This commit is contained in:
Andrew Dolgov 2021-03-17 19:28:20 +03:00
parent db0315e596
commit 968270ed48
9 changed files with 27 additions and 32 deletions

View File

@ -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 = `<div class="text-center">
<img class="icon-unpack-pending" src="${App.getInitParam('icon_three_dots')}">
row.querySelector(".content-inner").innerHTML = `<div class="text-center text-muted">
${__("Loading, please wait...")}
</div>`
}
},

View File

@ -533,8 +533,8 @@ const Headlines = {
<div class="content" onclick="return Headlines.click(event, ${hl.id}, true);">
${Article.renderNote(hl.id, hl.note)}
<div class="content-inner" lang="${hl.lang ? hl.lang : 'en'}">
<div class="text-center">
<img class="icon-unpack-pending" src="${App.getInitParam('icon_three_dots')}">
<div class="text-center text-muted">
${__("Loading, please wait...")}
</div>
</div>
<div class="intermediate">
@ -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();

View File

@ -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;

View File

@ -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;

View File

@ -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;

View File

@ -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;

View File

@ -594,10 +594,10 @@ body.ttrss_main {
border : 1px solid transparent;
.loadingNode {
opacity : 0;
display : none;
&.visible {
opacity : 1;
display : inline;
}
}

View File

@ -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;

View File

@ -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;