diff --git a/app/client/package.json b/app/client/package.json index 9bd649af8d..ee16c47a8a 100644 --- a/app/client/package.json +++ b/app/client/package.json @@ -18,8 +18,8 @@ "@github/g-emoji-element": "^1.1.5", "@manaflair/redux-batch": "^1.0.0", "@optimizely/optimizely-sdk": "^4.0.0", - "@sentry/react": "^5.24.2", - "@sentry/tracing": "^5.24.2", + "@sentry/react": "^6.2.4", + "@sentry/tracing": "^6.2.4", "@sentry/webpack-plugin": "^1.12.1", "@types/chance": "^1.0.7", "@types/lodash": "^4.14.120", diff --git a/app/client/src/components/editorComponents/CodeEditor/index.tsx b/app/client/src/components/editorComponents/CodeEditor/index.tsx index 3e785facf9..e2be816e09 100644 --- a/app/client/src/components/editorComponents/CodeEditor/index.tsx +++ b/app/client/src/components/editorComponents/CodeEditor/index.tsx @@ -45,6 +45,7 @@ import ScrollIndicator from "components/ads/ScrollIndicator"; import "codemirror/addon/fold/brace-fold"; import "codemirror/addon/fold/foldgutter"; import "codemirror/addon/fold/foldgutter.css"; +import * as Sentry from "@sentry/react"; const LightningMenu = lazy(() => retryPromise(() => import("components/editorComponents/LightningMenu")), @@ -459,4 +460,4 @@ const mapStateToProps = (state: AppState): ReduxStateProps => ({ dynamicData: getDataTreeForAutocomplete(state), }); -export default connect(mapStateToProps)(CodeEditor); +export default Sentry.withProfiler(connect(mapStateToProps)(CodeEditor)); diff --git a/app/client/src/configs/index.ts b/app/client/src/configs/index.ts index 0e8a47b79b..cf36ef7ffa 100644 --- a/app/client/src/configs/index.ts +++ b/app/client/src/configs/index.ts @@ -216,7 +216,7 @@ export const getAppsmithConfigs = (): AppsmithUIConfigs => { routingInstrumentation: Sentry.reactRouterV5Instrumentation(history), }), ], - tracesSampleRate: 0.5, + tracesSampleRate: 0.1, }, smartLook: { enabled: smartLook.enabled, diff --git a/app/client/src/pages/Editor/WidgetsEditor.tsx b/app/client/src/pages/Editor/WidgetsEditor.tsx index 21237cced1..048f5e773b 100644 --- a/app/client/src/pages/Editor/WidgetsEditor.tsx +++ b/app/client/src/pages/Editor/WidgetsEditor.tsx @@ -52,7 +52,6 @@ const CanvasContainer = styled.section` /* eslint-disable react/display-name */ const WidgetsEditor = () => { - PerformanceTracker.startTracking(PerformanceTransactionName.EDITOR_MOUNT); const { focusWidget, selectWidget } = useWidgetSelection(); const params = useParams<{ applicationId: string; pageId: string }>(); const dispatch = useDispatch(); @@ -64,7 +63,6 @@ const WidgetsEditor = () => { const currentApp = useSelector(getCurrentApplication); useDynamicAppLayout(); useEffect(() => { - PerformanceTracker.stopTracking(PerformanceTransactionName.EDITOR_MOUNT); PerformanceTracker.stopTracking(PerformanceTransactionName.CLOSE_SIDE_PANE); }); diff --git a/app/client/src/sagas/EvaluationsSaga.ts b/app/client/src/sagas/EvaluationsSaga.ts index 1a32707a4c..26bb33222f 100644 --- a/app/client/src/sagas/EvaluationsSaga.ts +++ b/app/client/src/sagas/EvaluationsSaga.ts @@ -106,12 +106,11 @@ function* postEvalActionDispatcher(actions: ReduxAction[]) { } function* evaluateTreeSaga(postEvalActions?: ReduxAction[]) { + const unevalTree = yield select(getUnevaluatedDataTree); + log.debug({ unevalTree }); PerformanceTracker.startAsyncTracking( PerformanceTransactionName.DATA_TREE_EVALUATION, ); - const unevalTree = yield select(getUnevaluatedDataTree); - log.debug({ unevalTree }); - const workerResponse = yield call( worker.request, EVAL_WORKER_ACTIONS.EVAL_TREE, @@ -120,22 +119,27 @@ function* evaluateTreeSaga(postEvalActions?: ReduxAction[]) { widgetTypeConfigMap, }, ); - const { errors, dataTree, dependencies, logs } = workerResponse; log.debug({ dataTree: dataTree }); logs.forEach((evalLog: any) => log.debug(evalLog)); evalErrorHandler(errors); + PerformanceTracker.stopAsyncTracking( + PerformanceTransactionName.DATA_TREE_EVALUATION, + ); + PerformanceTracker.startAsyncTracking( + PerformanceTransactionName.SET_EVALUATED_TREE, + ); yield put({ type: ReduxActionTypes.SET_EVALUATED_TREE, payload: dataTree, }); + PerformanceTracker.startAsyncTracking( + PerformanceTransactionName.SET_EVALUATED_TREE, + ); yield put({ type: ReduxActionTypes.SET_EVALUATION_INVERSE_DEPENDENCY_MAP, payload: { inverseDependencyMap: dependencies }, }); - PerformanceTracker.stopAsyncTracking( - PerformanceTransactionName.DATA_TREE_EVALUATION, - ); if (postEvalActions && postEvalActions.length) { yield call(postEvalActionDispatcher, postEvalActions); } diff --git a/app/client/src/sagas/InitSagas.ts b/app/client/src/sagas/InitSagas.ts index 7c528b85e4..353dec7f36 100644 --- a/app/client/src/sagas/InitSagas.ts +++ b/app/client/src/sagas/InitSagas.ts @@ -3,10 +3,10 @@ import { all, call, put, + race, select, take, takeLatest, - race, } from "redux-saga/effects"; import { InitializeEditorPayload, @@ -36,16 +36,22 @@ import { populatePageDSLsSaga } from "./PageSagas"; import log from "loglevel"; import * as Sentry from "@sentry/react"; import { - restoreRecentEntitiesRequest, resetRecentEntities, + restoreRecentEntitiesRequest, } from "actions/globalSearchActions"; import { resetEditorSuccess } from "actions/initActions"; +import PerformanceTracker, { + PerformanceTransactionName, +} from "utils/PerformanceTracker"; function* initializeEditorSaga( initializeEditorAction: ReduxAction, ) { const { applicationId, pageId } = initializeEditorAction.payload; try { + PerformanceTracker.startAsyncTracking( + PerformanceTransactionName.INIT_EDIT_APP, + ); yield put(setAppMode(APP_MODE.EDIT)); yield put(updateAppPersistentStore(getPersistentAppStore(applicationId))); yield put({ type: ReduxActionTypes.START_EVALUATION }); @@ -148,6 +154,9 @@ function* initializeEditorSaga( yield put({ type: ReduxActionTypes.INITIALIZE_EDITOR_SUCCESS, }); + PerformanceTracker.stopAsyncTracking( + PerformanceTransactionName.INIT_EDIT_APP, + ); } catch (e) { log.error(e); Sentry.captureException(e); @@ -167,6 +176,9 @@ export function* initializeAppViewerSaga( action: ReduxAction<{ applicationId: string; pageId: string }>, ) { const { applicationId, pageId } = action.payload; + PerformanceTracker.startAsyncTracking( + PerformanceTransactionName.INIT_VIEW_APP, + ); yield put(setAppMode(APP_MODE.PUBLISHED)); yield put(updateAppPersistentStore(getPersistentAppStore(applicationId))); yield put({ type: ReduxActionTypes.START_EVALUATION }); @@ -234,6 +246,9 @@ export function* initializeAppViewerSaga( yield put({ type: ReduxActionTypes.INITIALIZE_PAGE_VIEWER_SUCCESS, }); + PerformanceTracker.stopAsyncTracking( + PerformanceTransactionName.INIT_VIEW_APP, + ); if ("serviceWorker" in navigator) { yield put({ type: ReduxActionTypes.FETCH_ALL_PUBLISHED_PAGES, diff --git a/app/client/src/selectors/dataTreeSelectors.ts b/app/client/src/selectors/dataTreeSelectors.ts index 4be1e8205f..9b4f6cf231 100644 --- a/app/client/src/selectors/dataTreeSelectors.ts +++ b/app/client/src/selectors/dataTreeSelectors.ts @@ -9,9 +9,6 @@ import { DataTree, DataTreeFactory } from "entities/DataTree/dataTreeFactory"; import { getWidgets, getWidgetsMeta } from "sagas/selectors"; import "url-search-params-polyfill"; import { getPageList } from "./appViewSelectors"; -import PerformanceTracker, { - PerformanceTransactionName, -} from "utils/PerformanceTracker"; import { AppState } from "reducers"; export const getUnevaluatedDataTree = createSelector( @@ -22,11 +19,8 @@ export const getUnevaluatedDataTree = createSelector( getAppData, getPluginEditorConfigs, (actions, widgets, widgetsMeta, pageListPayload, appData, editorConfigs) => { - PerformanceTracker.startTracking( - PerformanceTransactionName.CONSTRUCT_UNEVAL_TREE, - ); const pageList = pageListPayload || []; - const unevalTree = DataTreeFactory.create({ + return DataTreeFactory.create({ actions, widgets, widgetsMeta, @@ -34,8 +28,6 @@ export const getUnevaluatedDataTree = createSelector( appData, editorConfigs, }); - PerformanceTracker.stopTracking(); - return unevalTree; }, ); diff --git a/app/client/src/selectors/editorSelectors.tsx b/app/client/src/selectors/editorSelectors.tsx index ae44c75e5e..9be7d4aea8 100644 --- a/app/client/src/selectors/editorSelectors.tsx +++ b/app/client/src/selectors/editorSelectors.tsx @@ -22,9 +22,6 @@ import { ContainerWidgetProps } from "widgets/ContainerWidget"; import { DataTreeWidget, ENTITY_TYPE } from "entities/DataTree/dataTreeFactory"; import { getActions } from "selectors/entitiesSelector"; -import PerformanceTracker, { - PerformanceTransactionName, -} from "utils/PerformanceTracker"; import { getCanvasWidgets } from "./entitiesSelector"; import { WidgetTypes } from "../constants/WidgetConstants"; @@ -150,9 +147,6 @@ export const getCanvasWidgetDsl = createSelector( evaluatedDataTree, loadingEntities, ): ContainerWidgetProps => { - PerformanceTracker.startTracking( - PerformanceTransactionName.CONSTRUCT_CANVAS_DSL, - ); const widgets: Record = {}; Object.keys(canvasWidgets).forEach((widgetKey) => { const canvasWidget = canvasWidgets[widgetKey]; @@ -169,11 +163,9 @@ export const getCanvasWidgetDsl = createSelector( ); }); - const denormalizedWidgets = CanvasWidgetsNormalizer.denormalize("0", { + return CanvasWidgetsNormalizer.denormalize("0", { canvasWidgets: widgets, }); - PerformanceTracker.stopTracking(); - return denormalizedWidgets; }, ); diff --git a/app/client/src/utils/PerformanceTracker.ts b/app/client/src/utils/PerformanceTracker.ts index 269f45259a..42651f8353 100644 --- a/app/client/src/utils/PerformanceTracker.ts +++ b/app/client/src/utils/PerformanceTracker.ts @@ -5,25 +5,14 @@ import _ from "lodash"; import * as log from "loglevel"; export enum PerformanceTransactionName { - DEPLOY_APPLICATION = "DEPLOY_APPLICATION", DATA_TREE_EVALUATION = "DATA_TREE_EVALUATION", - DATA_TREE_WORKER_EVALUATION = "DATA_TREE_WORKER_EVALUATION", - EVAL_REDUX_UPDATE = "EVAL_REDUX_UPDATE", - CONSTRUCT_UNEVAL_TREE = "CONSTRUCT_UNEVAL_TREE", - CONSTRUCT_CANVAS_DSL = "CONSTRUCT_CANVAS_DSL", - CREATE_DEPENDENCIES = "CREATE_DEPENDENCIES", - SORTED_DEPENDENCY_EVALUATION = "SORTED_DEPENDENCY_EVALUATION", - SET_WIDGET_LOADING = "SET_WIDGET_LOADING", - VALIDATE_DATA_TREE = "VALIDATE_DATA_TREE", + SET_EVALUATED_TREE = "SET_EVALUATED_TREE", EXECUTE_PAGE_LOAD_ACTIONS = "EXECUTE_PAGE_LOAD_ACTIONS", - EVALUATE_BINDING = "EVALUATE_BINDING", ENTITY_EXPLORER_ENTITY = "ENTITY_EXPLORER_ENTITY", ENTITY_EXPLORER = "ENTITY_EXPLORER", CLOSE_SIDE_PANE = "CLOSE_SIDE_PANE", OPEN_ACTION = "OPEN_ACTION", - EDITOR_MOUNT = "EDITOR_MOUNT", SIDE_BAR_MOUNT = "SIDE_BAR_MOUNT", - CANVAS_MOUNT = "CANVAS_MOUNT", EXECUTE_ACTION = "EXECUTE_ACTION", CHANGE_API_SAGA = "CHANGE_API_SAGA", SYNC_PARAMS_SAGA = "SYNC_PARAMS_SAGA", @@ -40,14 +29,8 @@ export enum PerformanceTransactionName { USER_ME_API = "USER_ME_API", SIGN_UP = "SIGN_UP", LOGIN_CLICK = "LOGIN_CLICK", - SET_EVALUATED = "SET_EVALUATED", -} - -export enum PerformanceTagNames { - PAGE_ID = "pageId", - APP_ID = "appId", - APP_MODE = "appMode", - TRANSACTION_SUCCESS = "transaction.success", + INIT_EDIT_APP = "INIT_EDIT_APP", + INIT_VIEW_APP = "INIT_VIEW_APP", } export interface PerfLog { diff --git a/app/client/yarn.lock b/app/client/yarn.lock index 8541e84ec9..b30972fff0 100644 --- a/app/client/yarn.lock +++ b/app/client/yarn.lock @@ -2524,13 +2524,14 @@ version "1.1.0" resolved "https://registry.yarnpkg.com/@scarf/scarf/-/scarf-1.1.0.tgz#b84b4a91cd938a688d36245b7a7db6fbc476a499" -"@sentry/browser@5.26.0": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-5.26.0.tgz#e90a197fb94c5f26c8e05d6a539c118f33c7d598" +"@sentry/browser@6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-6.2.4.tgz#b74757b1f76e7a525e6eaca39668db36db82cb21" + integrity sha512-OV1CQUxNawncpSEcrA+YccOu72rLC0tyYq/Pc4D/ihpfJmvR0o0L8vZYESay55V5lcqnJPFp8IyCJ2bF8IZTsA== dependencies: - "@sentry/core" "5.26.0" - "@sentry/types" "5.26.0" - "@sentry/utils" "5.26.0" + "@sentry/core" "6.2.4" + "@sentry/types" "6.2.4" + "@sentry/utils" "6.2.4" tslib "^1.9.3" "@sentry/cli@^1.58.0": @@ -2543,62 +2544,69 @@ progress "^2.0.3" proxy-from-env "^1.1.0" -"@sentry/core@5.26.0": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/core/-/core-5.26.0.tgz#9b5fe4de8a869d733ebcc77f5ec9c619f8717a51" +"@sentry/core@6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/core/-/core-6.2.4.tgz#613102074208958c580df4e7e06e9aa6b4d5f40c" + integrity sha512-8Z98OTM4wFS2n3T+V8a6cYWHDAk1byWuMb8JquZLdYgR5O1jkSpSFrhksQ+B/wDbVw05VOolSNFJsDTC2D5qXg== dependencies: - "@sentry/hub" "5.26.0" - "@sentry/minimal" "5.26.0" - "@sentry/types" "5.26.0" - "@sentry/utils" "5.26.0" + "@sentry/hub" "6.2.4" + "@sentry/minimal" "6.2.4" + "@sentry/types" "6.2.4" + "@sentry/utils" "6.2.4" tslib "^1.9.3" -"@sentry/hub@5.26.0": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/hub/-/hub-5.26.0.tgz#b2bbd8128cd5915f2ee59cbc29fff30272d74ec5" +"@sentry/hub@6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/hub/-/hub-6.2.4.tgz#0e25b851dc04b806713c8d878b1e11696ccf47ea" + integrity sha512-dY8Vj3c4oIirNNNzWkJvoRMzjlU8Nw3PJ/IwhdWjiQhj5/oqOzJwJQSMeOKdOGIhArAifr0hSXdy1+tHGEOOdQ== dependencies: - "@sentry/types" "5.26.0" - "@sentry/utils" "5.26.0" + "@sentry/types" "6.2.4" + "@sentry/utils" "6.2.4" tslib "^1.9.3" -"@sentry/minimal@5.26.0": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/minimal/-/minimal-5.26.0.tgz#851dea3644153ed3ac4837fa8ed5661d94e7a313" +"@sentry/minimal@6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/minimal/-/minimal-6.2.4.tgz#7d8d490b0942e14cde544c0a77550693e4702d97" + integrity sha512-KN+Abbz5CCAceSMvwymSG8GIVPaz4Y/xuY7R7dA8IlzncHaWRQ/Ss0PXjYUWL4YoTlTK6id1AW0i3JMICHMVgw== dependencies: - "@sentry/hub" "5.26.0" - "@sentry/types" "5.26.0" + "@sentry/hub" "6.2.4" + "@sentry/types" "6.2.4" tslib "^1.9.3" -"@sentry/react@^5.24.2": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/react/-/react-5.26.0.tgz#0462430757ac0ab0c10de803f39fb41d5ced1caa" +"@sentry/react@^6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/react/-/react-6.2.4.tgz#7d5a67a6e5f01238bf88e91433841da5180916f0" + integrity sha512-0TqM51HwnAUoDSYyK38Bq/m6xLqWHsOL98Uu4HoMMmx6VXW1xf1UDxhjmIQFfjWfYT5tlld0CoDRfTJJlc82Ow== dependencies: - "@sentry/browser" "5.26.0" - "@sentry/minimal" "5.26.0" - "@sentry/types" "5.26.0" - "@sentry/utils" "5.26.0" + "@sentry/browser" "6.2.4" + "@sentry/minimal" "6.2.4" + "@sentry/types" "6.2.4" + "@sentry/utils" "6.2.4" hoist-non-react-statics "^3.3.2" tslib "^1.9.3" -"@sentry/tracing@^5.24.2": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/tracing/-/tracing-5.26.0.tgz#33ee0426da14836e54e7b9a8838e4d7d0cb14b70" +"@sentry/tracing@^6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/tracing/-/tracing-6.2.4.tgz#4af650c180a41b72e130c7b92838fa9d1040792e" + integrity sha512-FNPTd22Q487SVyGM4BXlVeeRwPr9CG0OV8bz+GRHQtpVDhL+zdkGlIJYbxZnrOcdyYNVgLCJUPDHqyv55nhU4A== dependencies: - "@sentry/hub" "5.26.0" - "@sentry/minimal" "5.26.0" - "@sentry/types" "5.26.0" - "@sentry/utils" "5.26.0" + "@sentry/hub" "6.2.4" + "@sentry/minimal" "6.2.4" + "@sentry/types" "6.2.4" + "@sentry/utils" "6.2.4" tslib "^1.9.3" -"@sentry/types@5.26.0": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/types/-/types-5.26.0.tgz#b0cbacb0b24cd86620fb296b46cf7277bb004a3e" +"@sentry/types@6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/types/-/types-6.2.4.tgz#5974e64f000e6084d92d752e6ca199dc2ef4438f" + integrity sha512-c+vEExoj8H67NPaskTvxJBSAtDWzfFXOmlkicEZPUWbkL+Yxxlbzp1lI8K6GOks56UYMUBUU/fwQvv/34cO96g== -"@sentry/utils@5.26.0": - version "5.26.0" - resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-5.26.0.tgz#09a3d01d91747f38f796cafeb24f8fd86e4fa05f" +"@sentry/utils@6.2.4": + version "6.2.4" + resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-6.2.4.tgz#ab6a0bdfa2a32428f6b1ee87082d9bd40a226b11" + integrity sha512-lavbb3yQMUleVffmDkPH7X3dlgbXlyiFNmfER+swJ6WRxa4Yq6I8yea2s6maoqnZMhZe+yztn455DPwXIItfCA== dependencies: - "@sentry/types" "5.26.0" + "@sentry/types" "6.2.4" tslib "^1.9.3" "@sentry/webpack-plugin@^1.12.1":