Merge pull request #2 from rylev/significant

Significant

Author: rylev

site/static/compare.html

@@ -280,6 +280,17 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                         </li>
                     </ul>
                 </div>
+                <div class="section">
+                    <div class="section-heading"><span>Show only significant changes</span>
+                        <span class="tooltip">?
+                            <span class="tooltiptext">
+                                Whether to filter out all benchmarks that do not show significant changes. A significant
+                                change is any change above 0.2% for non-noisy benchmarks and 1.0% for noisy ones.
+                            </span>
+                        </span>
+                    </div>
+                    <input type="checkbox" v-model="filter.showOnlySignificant" style="margin-left: 20px;" />
+                </div>
             </div>
         </fieldset>
         <div v-if="data" id="content" style="margin-top: 15px">
@@ -288,15 +299,15 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                     <template v-for="bench in benches">
                         <tr data-field-start="true">
                             <th>
-                                <details class="toggle-table" v-on:toggle="benchGroupToggle">
+                                <details>
                                     <summary>{{ trimBenchName(bench.name) }}</summary>
                                 </details>
                             </th>
-                            <td>avg: <span v-bind:class="percentClass(bench.avgPct)">{{bench.avgPct}}%</span></td>
                             <td>min: <span v-bind:class="percentClass(bench.minPct)">{{bench.minPct}}%</span></td>
                             <td>max: <span
                                     v-bind:class="percentClass(bench.maxPct)">{{bench.maxPct}}%{{isDodgyBench(bench)
                                     ? "?" : ""}}</span></td>
+                            <td></td>
                         </tr>
                         <template v-for="run in bench.variants">
                             <tr>
@@ -314,9 +325,9 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                                 <td>
                                     <a
                                         v-bind:href="percentLink(data.b.commit, data.a.commit, bench.name, run.casename)">
-                                        <span v-bind:class="percentClass(run.percent)">{{ run.percent }}%{{run.isDodgy ?
-                                            "?"
-                                            : ""}}</span>
+                                        <span v-bind:class="percentClass(run.percent)">
+                                            {{ run.percent }}%{{run.isDodgy ? "?" : ""}}
+                                        </span>
                                     </a>
                                 </td>
                             </tr>
@@ -373,6 +384,7 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
             data: {
                 filter: {
                     name: null,
+                    showOnlySignificant: true,
                     cache: {
                         full: true,
                         incrFull: true,
@@ -419,6 +431,10 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                             const key = d[0];
                             const datumA = d[1];
                             const datumB = data.b.data[name].find(x => x[0] == key)[1];
+                            let percent = (100 * (datumB - datumA) / datumA).toFixed(1);
+                            if (percent === "-0.0") {
+                                percent = "0.0";
+                            }
 
                             let isDodgy = false;
                             if (data.variance) {
@@ -430,7 +446,7 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                                     casename: key,
                                     datumA,
                                     datumB,
-                                    percent: (100 * (datumB - datumA) / datumA).toFixed(1),
+                                    percent,
                                     isDodgy,
                                 });
                             }
@@ -442,19 +458,23 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                     let benches =
                         Object.keys(data.a.data).
                             filter(n => filter.name && filter.name.trim() ? n.includes(filter.name.trim()) : true).
-                            map(name => { return { name, variants: toVariants(name) } }).filter(b => b.variants.length > 0);
-
-                    for (let bench of benches) {
-                        let pcts = bench.variants.map(field => parseFloat(field.percent))
-                            .filter(p => p != undefined && p != null);
-                        bench.maxPct = Math.max(...pcts).toFixed(1);
-                        bench.minPct = Math.min(...pcts).toFixed(1);
-                        let sum = pcts.reduce((a, b) => a + b, 0);
-                        bench.avgPct = (sum / pcts.length).toFixed(1);
-                        bench.maxCasenameLen = Math.max(...bench.variants.map(f => f.casename.length));
-                    }
-                    const largestChange = a => Math.max(Math.abs(a.minPct), Math.abs(a.maxPct));
+                            map(name => {
+                                const variants = toVariants(name).filter(v => filter.showOnlySignificant ? isSignificant(v) : true);
+                                const pcts = variants.map(field => parseFloat(field.percent));
+                                const maxPct = Math.max(...pcts).toFixed(1);
+                                const minPct = Math.min(...pcts).toFixed(1);
+                                const maxCasenameLen = Math.max(...variants.map(f => f.casename.length));
+                                return {
+                                    name,
+                                    variants,
+                                    maxPct,
+                                    minPct,
+                                    maxCasenameLen,
+                                };
+                            }).
+                            filter(b => b.variants.length > 0);
 
+                    const largestChange = a => Math.max(Math.abs(a.minPct), Math.abs(a.maxPct));
                     benches.sort((a, b) => largestChange(b) - largestChange(a));
 
                     return benches;
@@ -543,10 +563,6 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                 commitLink(commit) {
                     return `https://github.com/rust-lang/rust/commit/${commit}`;
                 },
-                benchGroupToggle(e) {
-                    const element = e.target;
-                    toggleBenchGroup(element);
-                },
                 formatDate(date) {
                     date = new Date(date);
                     function padStr(i) {
@@ -563,34 +579,17 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
                     }
                     return result;
                 },
-                isDodgyBench(bench) {
-                    return bench.variants.some(f => f.isDodgy);
-                },
             },
-            watch: {
-                data(newVal, oldVal) {
-                    if (newVal && !oldVal) {
-                        this.$nextTick(() => {
-                            for (let element of document.querySelectorAll(".toggle-table")) {
-                                toggleBenchGroup(element);
-                            }
-                        });
-                    }
-                }
-            }
         });
 
-        function toggleBenchGroup(element) {
-            let next = element.parentElement.parentElement.nextElementSibling;
-            let inBody = []
-            while (next && next.getAttribute("data-field-start") !== "true") {
-                if (element.open) {
-                    next.style.display = "";
-                } else {
-                    next.style.display = "none";
-                }
-                next = next.nextElementSibling;
+        function isSignificant(variant) {
+            const percent = Math.abs(variant.percent);
+            if (variant.isDodgy) {
+                return percent > 1.0;
+            } else {
+                return percent > 0.2;
             }
+
         }
 
         function toggleFilters(id, toggle) {