core(byte-efficiency): replace pessimistic graph with optimistic (#15651

)
GoogleChrome · Dec 8, 2023 · c4d02c6 · c4d02c6
1 parent 9ce7626
commit c4d02c6
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 16 deletions.
diff --git a/core/audits/byte-efficiency/byte-efficiency-audit.js b/core/audits/byte-efficiency/byte-efficiency-audit.js
@@ -206,10 +206,10 @@ class ByteEfficiencyAudit extends Audit {
     if (metricComputationInput.gatherContext.gatherMode === 'navigation') {
       const graph = await PageDependencyGraph.request(metricComputationInput, context);
       const {
-        pessimisticGraph: pessimisticFCPGraph,
+        optimisticGraph: optimisticFCPGraph,
       } = await LanternFirstContentfulPaint.request(metricComputationInput, context);
       const {
-        pessimisticGraph: pessimisticLCPGraph,
+        optimisticGraph: optimisticLCPGraph,
       } = await LanternLargestContentfulPaint.request(metricComputationInput, context);
 
       wastedMs = this.computeWasteWithTTIGraph(results, graph, simulator, {
@@ -218,17 +218,19 @@ class ByteEfficiencyAudit extends Audit {
 
       const {savings: fcpSavings} = this.computeWasteWithGraph(
         results,
-        pessimisticFCPGraph,
+        optimisticFCPGraph,
         simulator,
         {providedWastedBytesByUrl: result.wastedBytesByUrl, label: 'fcp'}
       );
+      // Note: LCP's optimistic graph sometimes unexpectedly yields higher savings than the pessimistic graph.
       const {savings: lcpGraphSavings} = this.computeWasteWithGraph(
         results,
-        pessimisticLCPGraph,
+        optimisticLCPGraph,
         simulator,
         {providedWastedBytesByUrl: result.wastedBytesByUrl, label: 'lcp'}
       );
 
+
       // The LCP graph can underestimate the LCP savings if there is potential savings on the LCP record itself.
       let lcpRecordSavings = 0;
       const lcpRecord = await LCPImageRecord.request(metricComputationInput, context);

diff --git a/core/test/results/sample_v2.json b/core/test/results/sample_v2.json
@@ -4552,7 +4552,7 @@
       "warnings": [],
       "metricSavings": {
         "FCP": 0,
-        "LCP": 300
+        "LCP": 610
       },
       "details": {
         "type": "opportunity",
@@ -4590,7 +4590,7 @@
           "type": "debugdata",
           "metricSavings": {
             "FCP": 0,
-            "LCP": 300
+            "LCP": 610
           }
         }
       },
@@ -4639,7 +4639,7 @@
       "displayValue": "Potential savings of 63 KiB",
       "metricSavings": {
         "FCP": 0,
-        "LCP": 450
+        "LCP": 300
       },
       "details": {
         "type": "opportunity",
@@ -4693,7 +4693,7 @@
           "type": "debugdata",
           "metricSavings": {
             "FCP": 0,
-            "LCP": 450
+            "LCP": 300
           }
         }
       },
@@ -4862,7 +4862,7 @@
       "displayValue": "Potential savings of 143 KiB",
       "metricSavings": {
         "FCP": 150,
-        "LCP": 750
+        "LCP": 1060
       },
       "details": {
         "type": "opportunity",
@@ -4904,7 +4904,7 @@
           "type": "debugdata",
           "metricSavings": {
             "FCP": 150,
-            "LCP": 750
+            "LCP": 1060
           }
         }
       },
@@ -4946,14 +4946,14 @@
       "id": "efficient-animated-content",
       "title": "Use video formats for animated content",
       "description": "Large GIFs are inefficient for delivering animated content. Consider using MPEG4/WebM videos for animations and PNG/WebP for static images instead of GIF to save network bytes. [Learn more about efficient video formats](https://developer.chrome.com/docs/lighthouse/performance/efficient-animated-content/)",
-      "score": 0,
+      "score": 0.5,
       "scoreDisplayMode": "metricSavings",
       "numericValue": 3450,
       "numericUnit": "millisecond",
       "displayValue": "Potential savings of 666 KiB",
       "metricSavings": {
         "FCP": 0,
-        "LCP": 3300
+        "LCP": 0
       },
       "details": {
         "type": "opportunity",
@@ -4990,7 +4990,7 @@
           "type": "debugdata",
           "metricSavings": {
             "FCP": 0,
-            "LCP": 3300
+            "LCP": 0
           }
         }
       },
@@ -5032,14 +5032,14 @@
       "id": "legacy-javascript",
       "title": "Avoid serving legacy JavaScript to modern browsers",
       "description": "Polyfills and transforms enable legacy browsers to use new JavaScript features. However, many aren't necessary for modern browsers. For your bundled JavaScript, adopt a modern script deployment strategy using module/nomodule feature detection to reduce the amount of code shipped to modern browsers, while retaining support for legacy browsers. [Learn how to use modern JavaScript](https://web.dev/articles/publish-modern-javascript)",
-      "score": 0.5,
+      "score": 0,
       "scoreDisplayMode": "metricSavings",
       "numericValue": 450,
       "numericUnit": "millisecond",
       "displayValue": "Potential savings of 26 KiB",
       "metricSavings": {
         "FCP": 0,
-        "LCP": 0
+        "LCP": 150
       },
       "details": {
         "type": "opportunity",
@@ -5108,7 +5108,7 @@
           "type": "debugdata",
           "metricSavings": {
             "FCP": 0,
-            "LCP": 0
+            "LCP": 150
           }
         }
       },