New metric Total JS execution time

This commit is contained in:
Gaël Métais
2020-12-23 15:24:48 +01:00
parent 1e5f797195
commit df4f5685be
4 changed files with 17 additions and 6 deletions
+1 -1
View File
@@ -43,7 +43,7 @@
<div class="label">{{rule.policy.label}}</div>
<div class="result">
<span ng-if="rule.policy.unit == 'bytes'">{{rule.value | bytes}}</span>
<span ng-if="rule.policy.unit != 'bytes'">{{rule.value}}</span>
<span ng-if="rule.policy.unit != 'bytes'">{{rule.value}} <span ng-if="rule.policy.unit"> {{rule.policy.unit}}</span></span>
<span ng-if="rule.abnormal" class="icon-warning"><svg width="16" height="16" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M256 79L84 448h344L256 79zm0-79c11 0 22 7 30 22l219 436c17 30 2 54-32 54H39c-34 0-49-24-32-54L226 22c8-15 19-22 30-22zm0 192c18 0 32 14 32 32l-10 96h-44l-10-96c0-18 14-32 32-32z"/><circle cx="256" cy="384" r="31" stroke="#000"/></svg></span>
<span ng-if="rule.abnormalityScore <= -100" class="icon-warning"><svg width="16" height="16" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M256 79L84 448h344L256 79zm0-79c11 0 22 7 30 22l219 436c17 30 2 54-32 54H39c-34 0-49-24-32-54L226 22c8-15 19-22 30-22zm0 192c18 0 32 14 32 32l-10 96h-44l-10-96c0-18 14-32 32-32z"/><circle cx="256" cy="384" r="31" stroke="#000"/></svg></span>
<span ng-if="rule.abnormalityScore <= -300" class="icon-warning"><svg width="16" height="16" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M256 79L84 448h344L256 79zm0-79c11 0 22 7 30 22l219 436c17 30 2 54-32 54H39c-34 0-49-24-32-54L226 22c8-15 19-22 30-22zm0 192c18 0 32 14 32 32l-10 96h-44l-10-96c0-18 14-32 32-32z"/><circle cx="256" cy="384" r="31" stroke="#000"/></svg></span>
+2 -2
View File
@@ -12,12 +12,12 @@
<h3>
Value:
<span ng-if="rule.policy.unit == 'bytes'">{{rule.value | bytes}}</span>
<span ng-if="rule.policy.unit != 'bytes'">{{rule.value}}</span>
<span ng-if="rule.policy.unit != 'bytes'">{{rule.value}}<span ng-if="rule.policy.unit"> {{rule.policy.unit}}</span></span>
</h3>
<div class="okThreshold" ng-if="rule.score < 100 && rule.policy.isOkThreshold !== undefined">
Have
<span ng-if="rule.policy.unit == 'bytes'">{{rule.policy.isOkThreshold | bytes}}</span>
<span ng-if="rule.policy.unit != 'bytes'">{{rule.policy.isOkThreshold}}</span>
<span ng-if="rule.policy.unit != 'bytes'">{{rule.policy.isOkThreshold}}<span ng-if="rule.policy.unit"> {{rule.policy.unit}}</span></span>
<span ng-if="rule.policy.isOkThreshold > 0 && rule.policy.isOkThreshold < rule.policy.isBadThreshold">or less</span>
<span ng-if="rule.policy.isOkThreshold > rule.policy.isBadThreshold">or more</span>
to get the 100/100 score.
+10
View File
@@ -46,6 +46,16 @@ var policies = {
"isAbnormalThreshold": 50,
"hasOffenders": true
},
"scriptDuration": {
"tool": "phantomas",
"label": "Total JS execution time",
"message": "<p>This is the number of milliseconds spent by the browser on JavaScript execution during page load.</p><p>For more details, try using the performance tab in Chrome DevTools. It is a bit complicated at first sight, but you'll be able to analyze exactly where this execution time is spent.</p>",
"isOkThreshold": 500,
"isBadThreshold": 2000,
"isAbnormalThreshold": 4000,
"hasOffenders": false,
"unit": 'ms'
},
"DOMaccesses": {
"tool": "domAccessAgregator",
"label": "DOM access",
+4 -3
View File
@@ -13,7 +13,7 @@
"requests": {
"label": "Requests",
"policies": {
"totalRequests": 5,
"totalRequests": 2,
"domains": 3,
"notFound": 3,
"identicalFiles": 2,
@@ -35,7 +35,8 @@
"javascriptComplexity": {
"label": "JS complexity",
"policies": {
"DOMaccesses": 4,
"scriptDuration": 4,
"DOMaccesses": 3,
"eventsScrollBound": 1
}
},
@@ -105,7 +106,7 @@
},
"globalScore": {
"pageWeight": 3,
"requests": 3,
"requests": 2,
"domComplexity": 2,
"javascriptComplexity": 2,
"badJavascript": 2,