FieldDisplay: add cache to reuse field value calculations (#35072) (#35127)

* add timeline value cache

* add timeline value cache

* with console logs

* cleanup

Co-authored-by: Leon Sorokin <leeoniya@gmail.com>
(cherry picked from commit 744ca8d439)

Co-authored-by: Ryan McKinley <ryantxu@gmail.com>

packages/grafana-data/src/field/fieldOverrides.ts

@@ -2,6 +2,8 @@ import {
   ApplyFieldOverrideOptions,
   DataFrame,
   DataLink,
+  DisplayProcessor,
+  DisplayValue,
   DynamicConfigValue,
   Field,
   FieldColorModeId,
@@ -187,6 +189,11 @@ export function applyFieldOverrides(options: ApplyFieldOverrideOptions): DataFra
         timeZone: options.timeZone,
       });
 
+      // Wrap the display with a cache to avoid double calls
+      if (newField.config.unit !== 'dateTimeFromNow') {
+        newField.display = cachingDisplayProcessor(newField.display, 2500);
+      }
+
       // Attach data links supplier
       newField.getLinks = getLinksSupplier(
         newFrame,
@@ -204,6 +211,24 @@ export function applyFieldOverrides(options: ApplyFieldOverrideOptions): DataFra
   });
 }
 
+function cachingDisplayProcessor(disp: DisplayProcessor, maxCacheSize = 2500): DisplayProcessor {
+  const cache = new Map<any, DisplayValue>();
+
+  return (value: any) => {
+    let v = cache.get(value);
+    if (!v) {
+      // Don't grow too big
+      if (cache.size === maxCacheSize) {
+        cache.clear();
+      }
+
+      v = disp(value);
+      cache.set(value, v);
+    }
+    return v;
+  };
+}
+
 export interface FieldOverrideEnv extends FieldOverrideContext {
   fieldConfigRegistry: FieldConfigOptionsRegistry;
 }