New rules: eventsScrollBound & DOMaccessesOnScroll

lib/metadata/policies.js

@@ -66,6 +66,15 @@ var policies = {
             };
         }
     },
+    "DOMaccesses": {
+        "tool": "jsExecutionTransformer",
+        "label": "DOM access",
+        "message": "<p>TODO</p><p>TODO</p>",
+        "isOkThreshold": 50,
+        "isBadThreshold": 2000,
+        "isAbnormalThreshold": 3000,
+        "hasOffenders": false
+    },
     "DOMinserts": {
         "tool": "phantomas",
         "label": "DOM inserts",
@@ -195,6 +204,48 @@ var policies = {
             };
         }
     },
+    "eventsScrollBound": {
+        "tool": "phantomas",
+        "label": "Scroll events bound",
+        "message": "<p>Number of 'scroll' event listeners binded to 'window' or 'document'.</p><p>Asking too much work to the browser on scroll hurts the smoothness of the scroll. Merging all your event listeners into an unique listener can help you factorize their code and reduce their footprint on scroll.</p>",
+        "isOkThreshold": 1,
+        "isBadThreshold": 7,
+        "isAbnormalThreshold": 12,
+        "hasOffenders": true,
+        "offendersTransformFn": function(offenders) {
+            return {
+                count: offenders.length,
+                list: offenders.map(function(offender) {
+                    var parts = /^bound by (.*)$/.exec(offender);
+
+                    if (!parts) {
+                        debug('eventsScrollBound offenders transform function error with "%s"', offender);
+                        return {
+                            parseError: offender
+                        };
+                    }
+
+                    var backtraceArray = offendersHelpers.backtraceToArray(parts[1]);
+                    
+                    return {
+                        backtrace: backtraceArray || []
+                    };
+                })
+            };
+        }
+    },
+    "DOMaccessesOnScroll": {
+        "tool": "jsExecutionTransformer",
+        "label": "DOM access on scroll",
+        "message": "<p>This rule counts the number of DOM-accessing functions calls, 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 deboucing</a>.</p>",
+        "isOkThreshold": 1,
+        "isBadThreshold": 10,
+        "isAbnormalThreshold": 20,
+        "hasOffenders": true,
+        "offendersTransformFn": function(offenders) {
+            return offenders;
+        }
+    },
     "jsErrors": {
         "tool": "phantomas",
         "label": "JavaScript errors",

lib/metadata/scoreProfileGeneric.json

@@ -12,6 +12,7 @@
         "domManipulations": {
             "label": "DOM manipulations",
             "policies": {
+                "DOMaccesses": 3,
                 "DOMinserts": 2,
                 "DOMqueries": 1,
                 "DOMqueriesWithoutResults": 2,
@@ -19,6 +20,13 @@
                 "eventsBound": 1
             }
         },
+        "scroll": {
+            "label": "Scroll bottlenecks",
+            "policies": {
+                "eventsScrollBound": 1,
+                "DOMaccessesOnScroll": 4
+            }
+        },
         "badJavascript": {
             "label": "Bad JavaScript",
             "policies": {
@@ -99,6 +107,7 @@
     "globalScore": {
         "domComplexity": 1,
         "domManipulations": 2,
+        "scroll": 1,
         "badJavascript": 1,
         "jQueryVersion": 1,
         "cssSyntaxError": 1,