POC: to batch plugin responses this has reduced webworker scripting by 2 seconds #37762
Conversation
WalkthroughThe changes in this pull request focus on enhancing the Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Outside diff range and nitpick comments (1)
app/client/src/sagas/ActionExecution/PluginActionSaga.ts (1)
1703-1703: Remove unnecessary ESLint disable comment.The
// eslint-disable-next-line prefer-constcomment appears unnecessary. Consider removing it to maintain clean code.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
📒 Files selected for processing (1)
app/client/src/sagas/ActionExecution/PluginActionSaga.ts(4 hunks)
🔇 Additional comments (2)
app/client/src/sagas/ActionExecution/PluginActionSaga.ts (2)
5-5: Approved: Added necessary imports.
The inclusion of fork and race from redux-saga/effects is appropriate for the new saga functions.
Also applies to: 7-7
Line range hint 1682-1686: Approved: Updated parameters in handleUpdateActionData.
Extracting actionDataPayload and parentSpan directly from action enhances readability and aligns with the function's usage.
| @@ -1703,6 +1744,6 @@ export function* watchPluginActionExecutionSagas() { | |||
| ), | |||
| takeLatest(ReduxActionTypes.PLUGIN_SOFT_REFRESH, softRefreshActionsSaga), | |||
| takeEvery(ReduxActionTypes.EXECUTE_JS_UPDATES, makeUpdateJSCollection), | |||
| takeEvery(ReduxActionTypes.UPDATE_ACTION_DATA, handleUpdateActionData), | |||
| takeEvery(ReduxActionTypes.START_EVALUATION, captureActionsWithinPeriod), | |||
There was a problem hiding this comment.
Prevent multiple instances of captureActionsWithinPeriod.
Using takeEvery with captureActionsWithinPeriod may start multiple saga instances if START_EVALUATION is dispatched repeatedly. To ensure only a single instance runs, consider using takeLeading or starting the saga once.
Apply this diff to adjust the saga watcher:
export function* watchPluginActionExecutionSagas() {
yield all([
takeLatest(ReduxActionTypes.RUN_ACTION_REQUEST, runActionSaga),
takeLatest(
ReduxActionTypes.RUN_ACTION_SHORTCUT_REQUEST,
runActionShortcutSaga,
),
takeLatest(
ReduxActionTypes.EXECUTE_PAGE_LOAD_ACTIONS,
executePageLoadActionsSaga,
),
takeLatest(ReduxActionTypes.PLUGIN_SOFT_REFRESH, softRefreshActionsSaga),
takeEvery(ReduxActionTypes.EXECUTE_JS_UPDATES, makeUpdateJSCollection),
- takeEvery(ReduxActionTypes.START_EVALUATION, captureActionsWithinPeriod),
+ takeLeading(ReduxActionTypes.START_EVALUATION, captureActionsWithinPeriod),
]);
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| takeEvery(ReduxActionTypes.START_EVALUATION, captureActionsWithinPeriod), | |
| export function* watchPluginActionExecutionSagas() { | |
| yield all([ | |
| takeLatest(ReduxActionTypes.RUN_ACTION_REQUEST, runActionSaga), | |
| takeLatest( | |
| ReduxActionTypes.RUN_ACTION_SHORTCUT_REQUEST, | |
| runActionShortcutSaga, | |
| ), | |
| takeLatest( | |
| ReduxActionTypes.EXECUTE_PAGE_LOAD_ACTIONS, | |
| executePageLoadActionsSaga, | |
| ), | |
| takeLatest(ReduxActionTypes.PLUGIN_SOFT_REFRESH, softRefreshActionsSaga), | |
| takeEvery(ReduxActionTypes.EXECUTE_JS_UPDATES, makeUpdateJSCollection), | |
| takeLeading(ReduxActionTypes.START_EVALUATION, captureActionsWithinPeriod), | |
| ]); | |
| } |
| // Use a channel to queue all actions | ||
|
|
||
| function* captureActionsWithinPeriod() { | ||
| while (true) { | ||
| const buffer = []; // Initialize a new buffer for each batch | ||
| const endTime = Date.now() + 10000; | ||
| let parentSpan; | ||
| // eslint-disable-next-line prefer-const | ||
|
|
||
| while (Date.now() < endTime) { | ||
| try { | ||
| // Use a non-blocking `take` to capture actions within the period | ||
|
|
||
| const { action } = yield race({ | ||
| action: take(ReduxActionTypes.UPDATE_ACTION_DATA), | ||
| del: delay(1000), | ||
| }); | ||
|
|
||
| if (!action) continue; | ||
|
|
||
| const { actionDataPayload } = action.payload; | ||
|
|
||
| parentSpan = action.payload.parentSpan; | ||
| buffer.push(...actionDataPayload); | ||
| } catch (e) { | ||
| // Handle errors if needed | ||
| } | ||
| } | ||
|
|
||
| // After the time period, dispatch the collected actions | ||
| if (buffer.length > 0) { | ||
| yield fork(handleUpdateActionData, { | ||
| parentSpan, | ||
| actionDataPayload: buffer, | ||
| }); | ||
| } | ||
| } | ||
| } | ||
|
|
There was a problem hiding this comment.
🛠️ Refactor suggestion
Refactor looping mechanism to prevent high CPU usage.
The inner loop while (Date.now() < endTime) can cause high CPU utilization due to continuous execution. Consider using a more efficient approach that waits for actions or a timeout without busy-waiting.
Apply this diff to refactor the function:
function* captureActionsWithinPeriod() {
while (true) {
+ const buffer = []; // Initialize a new buffer for each batch
+ let parentSpan;
+ const startTime = Date.now();
+ const endTime = startTime + 10000;
+
+ while (Date.now() < endTime) {
try {
- const { action } = yield race({
- action: take(ReduxActionTypes.UPDATE_ACTION_DATA),
- del: delay(1000),
- });
+ const { action, timeout } = yield race({
+ action: take(ReduxActionTypes.UPDATE_ACTION_DATA),
+ timeout: delay(endTime - Date.now()),
+ });
- if (!action) continue;
+ if (timeout) {
+ break;
+ }
const { actionDataPayload } = action.payload;
parentSpan = action.payload.parentSpan;
buffer.push(...actionDataPayload);
} catch (e) {
// Handle errors if needed
}
}
// After the time period, dispatch the collected actions
if (buffer.length > 0) {
yield fork(handleUpdateActionData, {
parentSpan,
actionDataPayload: buffer,
});
}
}
}Committable suggestion skipped: line range outside the PR's diff.
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Outside diff range and nitpick comments (2)
app/client/src/workers/Evaluation/fns/utils/TriggerEmitter.ts (1)
Line range hint
109-116: Consider addressing the eslint TODOs.There are multiple TODOs about fixing eslint disable directives. Since we're touching this file, it would be good to properly type the data structures instead of using
any.Would you like help with properly typing these structures to remove the eslint disable comments?
app/client/src/ce/constants/ReduxActionConstants.tsx (1)
300-300: LGTM! Consider adding JSDoc comments.The new action type
TRIGGER_EVAL_BATCHaligns well with the PR's objective of batching plugin responses. The naming follows the established convention.Consider adding JSDoc comments to document the purpose and usage of this new action type:
/** * Action type for triggering batch evaluation of plugin responses. * Used to optimize performance by reducing webworker scripting time. */ TRIGGER_EVAL_BATCH: "TRIGGER_EVAL_BATCH",
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
📒 Files selected for processing (4)
app/client/src/ce/actions/evaluationActionsList.ts(1 hunks)app/client/src/ce/constants/ReduxActionConstants.tsx(1 hunks)app/client/src/sagas/ActionExecution/PluginActionSaga.ts(4 hunks)app/client/src/workers/Evaluation/fns/utils/TriggerEmitter.ts(1 hunks)
🔇 Additional comments (3)
app/client/src/ce/actions/evaluationActionsList.ts (1)
110-111: LGTM, but verify edge cases for batched evaluations.
The change aligns with the PR's performance optimization goals. However, since this modifies core evaluation behavior:
Let's verify other components that might expect immediate evaluation:
Consider documenting the batching behavior and any timing implications in the constants file or relevant documentation.
✅ Verification successful
Let me generate additional scripts to verify the impact of this change.
I want to check:
- How TRIGGER_EVAL_BATCH is being used
- The evaluation trigger patterns in sagas to understand the batching behavior
- The relationship between TRIGGER_EVAL and TRIGGER_EVAL_BATCH
This will help determine if removing TRIGGER_EVAL in favor of TRIGGER_EVAL_BATCH is safe.
LGTM - The change to use TRIGGER_EVAL_BATCH is safe
The code shows TRIGGER_EVAL_BATCH is properly implemented in PluginActionSaga.ts as a batched alternative to TRIGGER_EVAL. The remaining TRIGGER_EVAL usages are in distinct flows:
- WidgetLoadingSaga: For widget loading evaluation
- NavigateActionSaga: For navigation-specific evaluation
The change aligns with the PR's performance optimization goals by batching plugin responses while preserving necessary immediate evaluations in other contexts.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Search for direct dependencies on TRIGGER_EVAL
rg "TRIGGER_EVAL[^_]" --type ts
# Search for timing-sensitive evaluation patterns
ast-grep --pattern 'ReduxActionTypes.TRIGGER_EVAL'
Length of output: 152096
Script:
#!/bin/bash
# Search for TRIGGER_EVAL_BATCH usage and dependencies
rg "TRIGGER_EVAL_BATCH" --type ts -C 2
# Search for evaluation trigger patterns in sagas
rg "TRIGGER_EVAL" app/client/src/sagas/ -C 2
Length of output: 3310
app/client/src/sagas/ActionExecution/PluginActionSaga.ts (2)
1725-1762: Refactor looping mechanism to prevent high CPU usage.
Similar performance and error handling issues as captureActionsWithinPeriodTriggers.
1777-1781: Prevent multiple instances of captureActionsWithinPeriod.
Using takeEvery with both capture functions may start multiple saga instances if START_EVALUATION is dispatched repeatedly.
| const storeUpdatesHandler = priorityBatchedActionHandler((batchedData) => { | ||
| return WorkerMessenger.ping({ | ||
| method: MAIN_THREAD_ACTION.PROCESS_STORE_UPDATES, | ||
| data: batchedData, | ||
| }), | ||
| ); | ||
| }); | ||
| }); |
There was a problem hiding this comment.
💡 Codebase verification
Consider adding explicit returns to other batched handlers for consistency
Found similar handlers in TriggerEmitter.ts that would benefit from explicit returns:
defaultTriggerHandler- currently no return statement- Handler in
jsVariableUpdatesHandler- currently no return statement - Log processing handler - currently no return statement
🔗 Analysis chain
LGTM! The explicit return improves clarity.
The addition of the explicit return statement for WorkerMessenger.ping enhances code clarity and enables proper promise chaining if needed by callers.
Let's verify if other similar handlers need the same treatment:
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Search for other handlers that might benefit from explicit returns
ast-grep --pattern 'const $_Handler = priorityBatchedActionHandler((batchedData) => {
WorkerMessenger.ping({
$$$
})
})'
Length of output: 129
Script:
#!/bin/bash
# Let's try a broader search for priorityBatchedActionHandler usage
rg -A 5 "priorityBatchedActionHandler"
# Also search for similar patterns with WorkerMessenger.ping
rg -A 5 "WorkerMessenger.ping"
Length of output: 4869
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| function* handleUpdateActionData(action: any) { |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add proper TypeScript types instead of using 'any'.
Define an interface for the action parameter instead of using 'any' to maintain type safety.
-function* handleUpdateActionData(action: any) {
+interface UpdateActionDataPayload {
+ actionDataPayload: Array<{
+ entityName: string;
+ dataPath: string;
+ data: unknown;
+ }>;
+ parentSpan?: OtlpSpan;
+}
+function* handleUpdateActionData(action: UpdateActionDataPayload) {Committable suggestion skipped: line range outside the PR's diff.
| function* captureActionsWithinPeriodTriggers() { | ||
| while (true) { | ||
| const buffer = []; // Initialize a new buffer for each batch | ||
| const endTime = Date.now() + 10000; | ||
| // eslint-disable-next-line prefer-const | ||
|
|
||
| while (Date.now() < endTime) { | ||
| try { | ||
| // Use a non-blocking `take` to capture actions within the period | ||
|
|
||
| const { action } = yield race({ | ||
| action: take(ReduxActionTypes.TRIGGER_EVAL), | ||
| del: delay(1000), | ||
| }); | ||
|
|
||
| if (!action) continue; | ||
|
|
||
| buffer.push(action); | ||
| } catch (e) { | ||
| // Handle errors if needed | ||
| } | ||
| } | ||
|
|
||
| // After the time period, dispatch the collected actions | ||
| if (buffer.length > 0) { | ||
| yield put({ | ||
| type: ReduxActionTypes.TRIGGER_EVAL_BATCH, | ||
| }); | ||
| } | ||
| } | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Improve performance and error handling.
The function has two issues:
- The busy-waiting loop can cause high CPU usage
- Empty catch block could hide important errors
function* captureActionsWithinPeriodTriggers() {
while (true) {
const buffer = [];
- const endTime = Date.now() + 10000;
+ const BATCH_WINDOW = 10000;
+ const batchStart = Date.now();
- while (Date.now() < endTime) {
+ while (Date.now() - batchStart < BATCH_WINDOW) {
try {
const { action } = yield race({
action: take(ReduxActionTypes.TRIGGER_EVAL),
- del: delay(1000),
+ timeout: delay(Math.max(0, BATCH_WINDOW - (Date.now() - batchStart))),
});
if (!action) continue;
buffer.push(action);
} catch (e) {
- // Handle errors if needed
+ log.error("Error in captureActionsWithinPeriodTriggers:", e);
}
}
if (buffer.length > 0) {
yield put({
type: ReduxActionTypes.TRIGGER_EVAL_BATCH,
});
}
}
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function* captureActionsWithinPeriodTriggers() { | |
| while (true) { | |
| const buffer = []; // Initialize a new buffer for each batch | |
| const endTime = Date.now() + 10000; | |
| // eslint-disable-next-line prefer-const | |
| while (Date.now() < endTime) { | |
| try { | |
| // Use a non-blocking `take` to capture actions within the period | |
| const { action } = yield race({ | |
| action: take(ReduxActionTypes.TRIGGER_EVAL), | |
| del: delay(1000), | |
| }); | |
| if (!action) continue; | |
| buffer.push(action); | |
| } catch (e) { | |
| // Handle errors if needed | |
| } | |
| } | |
| // After the time period, dispatch the collected actions | |
| if (buffer.length > 0) { | |
| yield put({ | |
| type: ReduxActionTypes.TRIGGER_EVAL_BATCH, | |
| }); | |
| } | |
| } | |
| } | |
| function* captureActionsWithinPeriodTriggers() { | |
| while (true) { | |
| const buffer = []; | |
| const BATCH_WINDOW = 10000; | |
| const batchStart = Date.now(); | |
| while (Date.now() - batchStart < BATCH_WINDOW) { | |
| try { | |
| const { action } = yield race({ | |
| action: take(ReduxActionTypes.TRIGGER_EVAL), | |
| timeout: delay(Math.max(0, BATCH_WINDOW - (Date.now() - batchStart))), | |
| }); | |
| if (!action) continue; | |
| buffer.push(action); | |
| } catch (e) { | |
| log.error("Error in captureActionsWithinPeriodTriggers:", e); | |
| } | |
| } | |
| if (buffer.length > 0) { | |
| yield put({ | |
| type: ReduxActionTypes.TRIGGER_EVAL_BATCH, | |
| }); | |
| } | |
| } | |
| } |
|
/build-deploy-preview skip-tests=true |
|
Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/12063613461. |
|
Deploy-Preview-URL: https://ce-37762.dp.appsmith.com |
batching updateAction Data basically batching the results of plugin responses
Description
Tip
Add a TL;DR when the description is longer than 500 words or extremely technical (helps the content, marketing, and DevRel team).
Please also include relevant motivation and context. List any dependencies that are required for this change. Add links to Notion, Figma or any other documents that might be relevant to the PR.
Fixes #
Issue Numberor
Fixes
Issue URLWarning
If no issue exists, please create an issue first, and check with the maintainers if the issue is valid.
Automation
/ok-to-test tags="@tag.All"
🔍 Cypress test results
Caution
🔴 🔴 🔴 Some tests have failed.
Workflow run: https://github.com/appsmithorg/appsmith/actions/runs/12056385315
Commit: 9bd05ce
Cypress dashboard.
Tags: @tag.All
Spec:
The following are new failures, please fix them before merging the PR:
- cypress/e2e/Regression/Apps/CommunityIssues_Spec.ts
- cypress/e2e/Regression/Apps/ImportExportForkApplication_spec.js
- cypress/e2e/Regression/Apps/MongoDBShoppingCart_spec.ts
- cypress/e2e/Regression/ClientSide/ActionExecution/NavigateTo_spec.ts
- cypress/e2e/Regression/ClientSide/Autocomplete/JS_AC1_spec.ts
- cypress/e2e/Regression/ClientSide/Binding/TableTextPagination_spec.js
- cypress/e2e/Regression/ClientSide/Binding/TableV2TextPagination_spec.js
- cypress/e2e/Regression/ClientSide/Binding/TableV2_Api_spec.js
- cypress/e2e/Regression/ClientSide/Binding/Table_Api_spec.js
- cypress/e2e/Regression/ClientSide/BugTests/DS_Bug28985_spec.ts
- cypress/e2e/Regression/ClientSide/BugTests/JS_Bug29131_spec.ts
- cypress/e2e/Regression/ClientSide/Debugger/Widget_property_navigation_spec.ts
- cypress/e2e/Regression/ClientSide/ExplorerTests/Renaming_spec.js
- cypress/e2e/Regression/ClientSide/Git/ExistingApps/v1.9.24/DSCrudAndBindings_Spec.ts
- cypress/e2e/Regression/ClientSide/OneClickBinding/TableWidget/OneClickBindingMysql_spec.ts
- cypress/e2e/Regression/ClientSide/OneClickBinding/TableWidget/Table_MongoDB_spec.ts
- cypress/e2e/Regression/ClientSide/OneClickBinding/TableWidget/Table_postgres_spec.ts
- cypress/e2e/Regression/ClientSide/PeekOverlay/PeekOverlay_Spec.ts
- cypress/e2e/Regression/ClientSide/Widgets/Button/Button2_spec.ts
- cypress/e2e/Regression/ClientSide/Widgets/ListV2/Listv2_BasicServerSideData_spec.js
- cypress/e2e/Regression/ClientSide/Widgets/ListV2/Listv2_Meta_Hydration_ServerSide_spec.js
- cypress/e2e/Regression/ClientSide/Widgets/Migration_Spec.js
- cypress/e2e/Regression/ClientSide/Widgets/Modal/Modal_spec.ts
- cypress/e2e/Regression/ClientSide/Widgets/Radio/Radio2_spec.ts
- cypress/e2e/Regression/ClientSide/Widgets/Select/Select3_Spec.ts
- cypress/e2e/Regression/ServerSide/ApiTests/API_Bugs_Spec.js
- cypress/e2e/Regression/ServerSide/ApiTests/API_MultiPart_Spec.ts
- cypress/e2e/Regression/ServerSide/GenerateCRUD/MongoURI_Spec.ts
- cypress/e2e/Regression/ServerSide/GenerateCRUD/MySQL2_Spec.ts
- cypress/e2e/Regression/ServerSide/GenerateCRUD/Postgres2_Spec.ts
- cypress/e2e/Regression/ServerSide/MySQL_Datatypes/Basic_Spec.ts
- cypress/e2e/Regression/ServerSide/OnLoadTests/OnLoadActions_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/Array_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/Binary_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/BooleanEnum_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/Character_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/DateTime_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/Json_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/Numeric_Spec.ts
- cypress/e2e/Regression/ServerSide/Postgres_DataTypes/UUID_Spec.ts
- cypress/e2e/Regression/ServerSide/QueryPane/Mongo1_spec.ts
- cypress/e2e/Regression/ServerSide/QueryPane/S3_1_spec.js
- cypress/e2e/Regression/ServerSide/QueryPane/S3_2_spec.ts
- cypress/e2e/Sanity/Datasources/SMTPDatasource_spec.js
List of identified flaky tests.Wed, 27 Nov 2024 19:54:36 UTC
Communication
Should the DevRel and Marketing teams inform users about this change?
Summary by CodeRabbit
New Features
TRIGGER_EVAL_BATCHfor batch evaluations, enhancing the handling of multiple evaluations in a single action.Bug Fixes