Remove JS Timeline and Scroll Bottlenecks
This commit is contained in:
@@ -66,24 +66,6 @@ var policies = {
|
||||
};
|
||||
}
|
||||
},
|
||||
"DOMaccesses": {
|
||||
"tool": "jsExecutionTransformer",
|
||||
"label": "DOM access",
|
||||
"message": "<p>This metric counts the number of calls to DOM related functions (both native DOM functions and jQuery functions) on page load.</p><p>The more your JavaScript code accesses the DOM, the slower the page will load.</p><p>Try, as much as possible, to have an HTML page fully generated by the server instead of making changes with JS.</p><p>Try to reduce the number of queries by refactoring your JavaScript code.</p><p>Binding too many events also has a cost. Try to use <a href=\"https://learn.jquery.com/events/event-delegation/\" target=\"_blank\">event delegation</a> as much as possible.</p>",
|
||||
"isOkThreshold": 200,
|
||||
"isBadThreshold": 2000,
|
||||
"isAbnormalThreshold": 4000,
|
||||
"hasOffenders": false
|
||||
},
|
||||
"queriesWithoutResults": {
|
||||
"tool": "jsExecutionTransformer",
|
||||
"label": "Queries without result",
|
||||
"message": "<p>Number of queries that return no result. Both native and jQuery DOM requests are counted.</p><p>It suggests the query is not used on the page, probably because it is some dead code.</p><p>Or maybe the code is trying to find an HTML block that is not always here. Look at the JS Timeline to see if the scripts correctly figures out the HTML block is not here and immediatly stops interacting further with the DOM.</p>",
|
||||
"isOkThreshold": 0,
|
||||
"isBadThreshold": 150,
|
||||
"isAbnormalThreshold": 250,
|
||||
"hasOffenders": false
|
||||
},
|
||||
"DOMqueriesAvoidable": {
|
||||
"tool": "phantomas",
|
||||
"label": "Duplicated DOM queries",
|
||||
@@ -147,18 +129,6 @@ var policies = {
|
||||
};
|
||||
}
|
||||
},
|
||||
"DOMaccessesOnScroll": {
|
||||
"tool": "jsExecutionTransformer",
|
||||
"label": "DOM access on scroll",
|
||||
"message": "<p>This rule counts the number of DOM-accessing functions calls on a scroll event, such as queries, readings, writings, bindings and jQuery functions.</p><p>Two scroll events are triggered quickly, one after the other, and only the second one is analyzed so throttled functions are ignored.</p><p>One of the main reasons of a poor scrolling experience is when too much JS is executed on each scroll event. Note that some devices such as smartphones and MacBooks send more scroll events than others.</p><p>Reduce the number of DOM accesses inside scroll listeners. Put DOM queries outside them when possible. Use <a href=\"http://blogorama.nerdworks.in/javascriptfunctionthrottlingan/\" target=\"_blank\">throttling or debouncing</a>.</p>",
|
||||
"isOkThreshold": 1,
|
||||
"isBadThreshold": 20,
|
||||
"isAbnormalThreshold": 35,
|
||||
"hasOffenders": true,
|
||||
"offendersTransformFn": function(offenders) {
|
||||
return offenders;
|
||||
}
|
||||
},
|
||||
"jsErrors": {
|
||||
"tool": "phantomas",
|
||||
"label": "JavaScript errors",
|
||||
@@ -348,24 +318,6 @@ var policies = {
|
||||
"isAbnormalThreshold": 2,
|
||||
"hasOffenders": true
|
||||
},
|
||||
"jQueryCallsOnEmptyObject": {
|
||||
"tool": "jsExecutionTransformer",
|
||||
"label": "Calls on empty objects",
|
||||
"message": "<p>This metric counts the number of jQuery functions called on an empty jQuery object. The call was useless.</p><p>This can be helpful to detect dead or unused code.</p>",
|
||||
"isOkThreshold": 1,
|
||||
"isBadThreshold": 100,
|
||||
"isAbnormalThreshold": 180,
|
||||
"hasOffenders": false
|
||||
},
|
||||
"jQueryNotDelegatedEvents": {
|
||||
"tool": "jsExecutionTransformer",
|
||||
"label": "Events not delegated",
|
||||
"message": "<p>This is the number of events that are bound with the .bind() or the .on() function without using <a href=\"https://learn.jquery.com/events/event-delegation/\" target=\"_blank\">event delegation</a>.</p><p>This means jQuery binds each element contained in the object one by one. This is bad for performance.</p>",
|
||||
"isOkThreshold": 1,
|
||||
"isBadThreshold": 100,
|
||||
"isAbnormalThreshold": 180,
|
||||
"hasOffenders": false
|
||||
},
|
||||
"cssParsingErrors": {
|
||||
"tool": "phantomas",
|
||||
"label": "CSS syntax error",
|
||||
|
||||
@@ -32,21 +32,6 @@
|
||||
"DOMidDuplicated": 1
|
||||
}
|
||||
},
|
||||
"domManipulations": {
|
||||
"label": "DOM manipulations",
|
||||
"policies": {
|
||||
"DOMaccesses": 3,
|
||||
"queriesWithoutResults": 1,
|
||||
"DOMqueriesAvoidable": 1
|
||||
}
|
||||
},
|
||||
"scroll": {
|
||||
"label": "Scroll bottlenecks",
|
||||
"policies": {
|
||||
"eventsScrollBound": 1,
|
||||
"DOMaccessesOnScroll": 4
|
||||
}
|
||||
},
|
||||
"badJavascript": {
|
||||
"label": "Bad JavaScript",
|
||||
"policies": {
|
||||
@@ -116,8 +101,6 @@
|
||||
"pageWeight": 3,
|
||||
"requests": 3,
|
||||
"domComplexity": 2,
|
||||
"domManipulations": 2,
|
||||
"scroll": 1,
|
||||
"badJavascript": 2,
|
||||
"jQuery": 1,
|
||||
"cssSyntaxError": 1,
|
||||
|
||||
Reference in New Issue
Block a user