chore: cache dependencyMap computation on client

app/client/src/UITelemetry/generateWebWorkerTraces.ts

@@ -14,7 +14,7 @@ export interface WebworkerSpanData {
 //to regular otlp telemetry data and subsequently exported to our telemetry collector
 export const newWebWorkerSpanData = (
   spanName: string,
-  attributes: SpanAttributes,
+  attributes: SpanAttributes = {},
 ): WebworkerSpanData => {
   return {
     attributes,
@@ -28,6 +28,19 @@ const addEndTimeForWebWorkerSpanData = (span: WebworkerSpanData) => {
   span.endTime = Date.now();
 };
 
+export const profileAsyncFn = async <T>(
+  spanName: string,
+  fn: () => Promise<T>,
+  allSpans: Record<string, WebworkerSpanData | SpanAttributes>,
+  attributes: SpanAttributes = {},
+) => {
+  const span = newWebWorkerSpanData(spanName, attributes);
+  const res: T = await fn();
+  addEndTimeForWebWorkerSpanData(span);
+  allSpans[spanName] = span;
+  return res;
+};
+
 export const profileFn = <T>(
   spanName: string,
   attributes: SpanAttributes = {},

app/client/src/ce/sagas/PageSagas.tsx

@@ -402,11 +402,10 @@ export function* fetchPublishedPageResourcesSaga(
       // We need to recall consolidated view API in order to fetch actions when page is switched
       // As in the first call only actions of the current page are fetched
       // In future, we can reuse this saga to fetch other resources of the page like actionCollections etc
-      const { publishedActions } = response;
+      const { pages, publishedActions } = response;
 
-      // Sending applicationId as empty as we have publishedActions present,
-      // it won't call the actions view api with applicationId
-      yield put(fetchActionsForView({ applicationId: "", publishedActions }));
+      const applicationId = pages.data.application.id;
+      yield put(fetchActionsForView({ applicationId, publishedActions }));
       yield put(fetchAllPageEntityCompletion([executePageLoadActions()]));
     }
   } catch (error) {

app/client/src/ce/workers/Evaluation/evalWorkerActions.ts

@@ -1,6 +1,5 @@
 export enum EVAL_WORKER_SYNC_ACTION {
   SETUP = "SETUP",
-  EVAL_TREE = "EVAL_TREE",
   EVAL_ACTION_BINDINGS = "EVAL_ACTION_BINDINGS",
   CLEAR_CACHE = "CLEAR_CACHE",
   VALIDATE_PROPERTY = "VALIDATE_PROPERTY",
@@ -16,6 +15,7 @@ export enum EVAL_WORKER_SYNC_ACTION {
 }
 
 export enum EVAL_WORKER_ASYNC_ACTION {
+  EVAL_TREE = "EVAL_TREE",
   EVAL_TRIGGER = "EVAL_TRIGGER",
   EVAL_EXPRESSION = "EVAL_EXPRESSION",
   LOAD_LIBRARIES = "LOAD_LIBRARIES",

app/client/src/pages/AppViewer/index.tsx

@@ -31,6 +31,7 @@ import { CANVAS_SELECTOR } from "constants/WidgetConstants";
 import {
   setupPublishedPage,
   fetchPublishedPageResourcesAction,
+  updateCurrentPage,
 } from "actions/pageActions";
 import usePrevious from "utils/hooks/usePrevious";
 import { getIsBranchUpdated } from "../utils";
@@ -163,8 +164,10 @@ function AppViewer(props: Props) {
           (page) => page.basePageId === basePageId,
         )?.pageId;
         if (pageId) {
-          dispatch(setupPublishedPage(pageId, true));
-
+          dispatch(updateCurrentPage(pageId));
+          // TODO: Patch fix to avoid dispatch of FETCH_ALL_PAGE_ENTITY_COMPLETION twice
+          // Remove this once Sneha's PR is merged
+          dispatch(setupPublishedPage(pageId, true, true));
           // Used for fetching page resources
           dispatch(fetchPublishedPageResourcesAction(basePageId));
         }

app/client/src/sagas/EvaluationsSaga.test.ts

@@ -20,6 +20,14 @@ import {
 } from "ee/constants/ReduxActionConstants";
 import { fetchPluginFormConfigsSuccess } from "actions/pluginActions";
 import { createJSCollectionSuccess } from "actions/jsActionActions";
+import { getInstanceId } from "ee/selectors/tenantSelectors";
+import {
+  getApplicationLastDeployedAt,
+  getCurrentApplicationId,
+  getCurrentPageId,
+} from "selectors/editorSelectors";
+import { getCurrentWorkspaceId } from "ee/selectors/selectedWorkspaceSelectors";
+
 jest.mock("loglevel");
 
 describe("evaluateTreeSaga", () => {
@@ -39,8 +47,24 @@ describe("evaluateTreeSaga", () => {
         [select(getSelectedAppTheme), {}],
         [select(getAppMode), false],
         [select(getWidgetsMeta), {}],
+        [select(getInstanceId), "instanceId"],
+        [select(getCurrentWorkspaceId), "workspaceId"],
+        [select(getCurrentApplicationId), "applicationId"],
+        [select(getCurrentPageId), "pageId"],
+        [
+          select(getApplicationLastDeployedAt),
+          new Date("11 September 2024").toISOString(),
+        ],
       ])
       .call(evalWorker.request, EVAL_WORKER_ACTIONS.EVAL_TREE, {
+        cacheProps: {
+          instanceId: "instanceId",
+          workspaceId: "workspaceId",
+          appId: "applicationId",
+          pageId: "pageId",
+          appMode: false,
+          timestamp: new Date("11 September 2024").toISOString(),
+        },
         unevalTree: unEvalAndConfigTree,
         widgetTypeConfigMap: undefined,
         widgets: {},
@@ -69,8 +93,24 @@ describe("evaluateTreeSaga", () => {
         [select(getSelectedAppTheme), {}],
         [select(getAppMode), false],
         [select(getWidgetsMeta), {}],
+        [select(getInstanceId), "instanceId"],
+        [select(getCurrentApplicationId), "applicationId"],
+        [select(getCurrentPageId), "pageId"],
+        [
+          select(getApplicationLastDeployedAt),
+          new Date("11 September 2024").toISOString(),
+        ],
+        [select(getCurrentWorkspaceId), "workspaceId"],
       ])
       .call(evalWorker.request, EVAL_WORKER_ACTIONS.EVAL_TREE, {
+        cacheProps: {
+          instanceId: "instanceId",
+          workspaceId: "workspaceId",
+          appId: "applicationId",
+          pageId: "pageId",
+          appMode: false,
+          timestamp: new Date("11 September 2024").toISOString(),
+        },
         unevalTree: unEvalAndConfigTree,
         widgetTypeConfigMap: undefined,
         widgets: {},
@@ -109,8 +149,24 @@ describe("evaluateTreeSaga", () => {
         [select(getSelectedAppTheme), {}],
         [select(getAppMode), false],
         [select(getWidgetsMeta), {}],
+        [select(getInstanceId), "instanceId"],
+        [select(getCurrentApplicationId), "applicationId"],
+        [select(getCurrentPageId), "pageId"],
+        [
+          select(getApplicationLastDeployedAt),
+          new Date("11 September 2024").toISOString(),
+        ],
+        [select(getCurrentWorkspaceId), "workspaceId"],
       ])
       .call(evalWorker.request, EVAL_WORKER_ACTIONS.EVAL_TREE, {
+        cacheProps: {
+          instanceId: "instanceId",
+          workspaceId: "workspaceId",
+          appId: "applicationId",
+          pageId: "pageId",
+          appMode: false,
+          timestamp: new Date("11 September 2024").toISOString(),
+        },
         unevalTree: unEvalAndConfigTree,
         widgetTypeConfigMap: undefined,
         widgets: {},

app/client/src/sagas/EvaluationsSaga.ts

@@ -111,6 +111,13 @@ import { evalErrorHandler } from "./EvalErrorHandler";
 import AnalyticsUtil from "ee/utils/AnalyticsUtil";
 import { endSpan, startRootSpan } from "UITelemetry/generateTraces";
 import { transformTriggerEvalErrors } from "ee/sagas/helpers";
+import {
+  getApplicationLastDeployedAt,
+  getCurrentApplicationId,
+  getCurrentPageId,
+} from "selectors/editorSelectors";
+import { getInstanceId } from "ee/selectors/tenantSelectors";
+import { getCurrentWorkspaceId } from "ee/selectors/selectedWorkspaceSelectors";
 
 const APPSMITH_CONFIGS = getAppsmithConfigs();
 export const evalWorker = new GracefulWorkerService(
@@ -253,14 +260,26 @@ export function* evaluateTreeSaga(
   const theme: ReturnType<typeof getSelectedAppTheme> =
     yield select(getSelectedAppTheme);
   log.debug({ unevalTree, configTree: unEvalAndConfigTree.configTree });
-
+  const instanceId: string = yield select(getInstanceId);
+  const workspaceId: string = yield select(getCurrentWorkspaceId);
+  const applicationId: string = yield select(getCurrentApplicationId);
+  const pageId: string = yield select(getCurrentPageId);
+  const lastDeployedAt: string = yield select(getApplicationLastDeployedAt);
   const appMode: ReturnType<typeof getAppMode> = yield select(getAppMode);
   const widgetsMeta: ReturnType<typeof getWidgetsMeta> =
     yield select(getWidgetsMeta);
 
   const shouldRespondWithLogs = log.getLevel() === log.levels.DEBUG;
 
   const evalTreeRequestData: EvalTreeRequestData = {
+    cacheProps: {
+      appMode,
+      appId: applicationId,
+      pageId,
+      timestamp: lastDeployedAt,
+      instanceId,
+      workspaceId,
+    },
     unevalTree: unEvalAndConfigTree,
     widgetTypeConfigMap,
     widgets,

app/client/src/workers/Evaluation/__tests__/evaluation.test.ts

@@ -18,6 +18,7 @@ import WidgetFactory from "WidgetProvider/factory";
 import { generateDataTreeWidget } from "entities/DataTree/dataTreeWidget";
 import { sortObjectWithArray } from "../../../utils/treeUtils";
 import klona from "klona";
+import { APP_MODE } from "entities/App";
 
 const klonaFullSpy = jest.fn();
 jest.mock("klona/full", () => ({
@@ -563,8 +564,20 @@ describe("DataTreeEvaluator", () => {
 
   const evaluator = new DataTreeEvaluator(WIDGET_CONFIG_MAP);
 
-  it("Checks the number of clone operations in first tree flow", () => {
-    evaluator.setupFirstTree(unEvalTree, configTree);
+  it("Checks the number of clone operations in first tree flow", async () => {
+    await evaluator.setupFirstTree(
+      unEvalTree,
+      configTree,
+      {},
+      {
+        appId: "appId",
+        pageId: "pageId",
+        timestamp: "timestamp",
+        appMode: APP_MODE.PUBLISHED,
+        instanceId: "instanceId",
+        workspaceId: "workspaceId",
+      },
+    );
     evaluator.evalAndValidateFirstTree();
     // Hard check to not regress on the number of clone operations. Try to improve this number.
     expect(klonaFullSpy).toBeCalledTimes(41);

app/client/src/workers/Evaluation/evalTreeWithChanges.test.ts

@@ -9,6 +9,7 @@ import type { WidgetEntity } from "plugins/Linting/lib/entity/WidgetEntity";
 import type { UpdateDataTreeMessageData } from "sagas/EvalWorkerActionSagas";
 import DataTreeEvaluator from "workers/common/DataTreeEvaluator";
 import * as evalTreeWithChanges from "./evalTreeWithChanges";
+import { APP_MODE } from "entities/App";
 export const BASE_WIDGET = {
   widgetId: "randomID",
   widgetName: "randomWidgetName",
@@ -179,9 +180,21 @@ describe("evaluateAndGenerateResponse", () => {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     return updates.filter((p: any) => !p.rhs.__evaluation__);
   };
-  beforeEach(() => {
+  beforeEach(async () => {
     evaluator = new DataTreeEvaluator(WIDGET_CONFIG_MAP);
-    evaluator.setupFirstTree(unEvalTree, configTree);
+    await evaluator.setupFirstTree(
+      unEvalTree,
+      configTree,
+      {},
+      {
+        appId: "appId",
+        pageId: "pageId",
+        timestamp: "timestamp",
+        appMode: APP_MODE.PUBLISHED,
+        instanceId: "instanceId",
+        workspaceId: "workspaceId",
+      },
+    );
     evaluator.evalAndValidateFirstTree();
   });
 

app/client/src/workers/Evaluation/handlers/evalTree.ts

@@ -14,11 +14,7 @@ import {
   CrashingError,
   getSafeToRenderDataTree,
 } from "ee/workers/Evaluation/evaluationUtils";
-import type {
-  EvalTreeRequestData,
-  EvalTreeResponseData,
-  EvalWorkerSyncRequest,
-} from "../types";
+import type { EvalTreeRequestData, EvalWorkerASyncRequest } from "../types";
 import { clearAllIntervals } from "../fns/overrides/interval";
 import JSObjectCollection from "workers/Evaluation/JSObject/Collection";
 import { getJSVariableCreatedEvents } from "../JSObject/JSVariableEvents";
@@ -33,6 +29,7 @@ import { MessageType, sendMessage } from "utils/MessageUtil";
 import {
   profileFn,
   newWebWorkerSpanData,
+  profileAsyncFn,
 } from "UITelemetry/generateWebWorkerTraces";
 import type { SpanAttributes } from "UITelemetry/generateTraces";
 import type { CanvasWidgetsReduxState } from "reducers/entityReducers/canvasWidgetsReducer";
@@ -49,9 +46,9 @@ export let canvasWidgetsMeta: Record<string, any>;
 export let metaWidgetsCache: MetaWidgetsReduxState;
 export let canvasWidgets: CanvasWidgetsReduxState;
 
-export function evalTree(
-  request: EvalWorkerSyncRequest<EvalTreeRequestData>,
-): EvalTreeResponseData {
+export async function evalTree(
+  request: EvalWorkerASyncRequest<EvalTreeRequestData>,
+) {
   const { data, webworkerTelemetry } = request;
 
   webworkerTelemetry["transferDataToWorkerThread"].endTime = Date.now();
@@ -76,6 +73,7 @@ export function evalTree(
     affectedJSObjects,
     allActionValidationConfig,
     appMode,
+    cacheProps,
     forceEvaluation,
     metaWidgets,
     shouldReplay,
@@ -108,16 +106,17 @@ export function evalTree(
         allActionValidationConfig,
       );
 
-      const setupFirstTreeResponse = profileFn(
+      const setupFirstTreeResponse = await profileAsyncFn(
         "setupFirstTree",
-        { description: "during initialisation" },
+        (dataTreeEvaluator as DataTreeEvaluator).setupFirstTree.bind(
+          dataTreeEvaluator,
+          unevalTree,
+          configTree,
+          webworkerTelemetry,
+          cacheProps,
+        ),
         webworkerTelemetry,
-        () =>
-          (dataTreeEvaluator as DataTreeEvaluator).setupFirstTree(
-            unevalTree,
-            configTree,
-            webworkerTelemetry,
-          ),
+        { description: "during initialisation" },
       );
 
       evalOrder = setupFirstTreeResponse.evalOrder;
@@ -127,8 +126,9 @@ export function evalTree(
         "evalAndValidateFirstTree",
         { description: "during initialisation" },
         webworkerTelemetry,
-        () =>
-          (dataTreeEvaluator as DataTreeEvaluator).evalAndValidateFirstTree(),
+        (dataTreeEvaluator as DataTreeEvaluator).evalAndValidateFirstTree.bind(
+          dataTreeEvaluator,
+        ),
       );
 
       dataTree = makeEntityConfigsAsObjProperties(dataTreeResponse.evalTree, {
@@ -156,15 +156,17 @@ export function evalTree(
         );
       }
 
-      const setupFirstTreeResponse = profileFn(
+      const setupFirstTreeResponse = await profileAsyncFn(
         "setupFirstTree",
-        { description: "non-initialisation" },
+        (dataTreeEvaluator as DataTreeEvaluator).setupFirstTree.bind(
+          dataTreeEvaluator,
+          unevalTree,
+          configTree,
+          webworkerTelemetry,
+          cacheProps,
+        ),
         webworkerTelemetry,
-        () =>
-          (dataTreeEvaluator as DataTreeEvaluator).setupFirstTree(
-            unevalTree,
-            configTree,
-          ),
+        { description: "non-initialisation" },
       );
       isCreateFirstTree = true;
       evalOrder = setupFirstTreeResponse.evalOrder;

app/client/src/workers/Evaluation/handlers/index.ts

@@ -31,7 +31,6 @@ const syncHandlerMap: Record<
   (req: EvalWorkerSyncRequest) => any
 > = {
   [EVAL_WORKER_ACTIONS.EVAL_ACTION_BINDINGS]: evalActionBindings,
-  [EVAL_WORKER_ACTIONS.EVAL_TREE]: evalTree,
   [EVAL_WORKER_ACTIONS.EVAL_TREE_WITH_CHANGES]: evalTreeWithChanges,
   [EVAL_WORKER_ACTIONS.UNDO]: undo,
   [EVAL_WORKER_ACTIONS.REDO]: redo,
@@ -52,6 +51,7 @@ const asyncHandlerMap: Record<
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   (req: EvalWorkerASyncRequest) => any
 > = {
+  [EVAL_WORKER_ACTIONS.EVAL_TREE]: evalTree,
   [EVAL_WORKER_ACTIONS.EVAL_TRIGGER]: evalTrigger,
   [EVAL_WORKER_ACTIONS.EVAL_EXPRESSION]: evalExpression,
   [EVAL_WORKER_ACTIONS.LOAD_LIBRARIES]: loadLibraries,