appsmith icon indicating copy to clipboard operation
appsmith copied to clipboard

Published 20 hours ago • verified publisher icon appsmithorg

perf: Widget re-rendering refactor

Open ashit-rath opened this issue 2 years ago • 120 comments

Description

This PR has core logic changes on how widgets are rendered. Instead of the entire DSL flowing through the flow of creating canvases and widgets, Only a structure similar to DSL is used to do the Same. This Structure only contains a bare bones structure, and the actual widget properties are selected directly from the store for each individual widgets.

Changes also includes,

  • Updating state of changed widgets instead of all the widgets in the Redux state (using diff to find the updated widgets and also added to framework to skip diffing when updated widgets are already know, which can be used in the future on state updates).
  • Selecting occupied spaces in components only when needed
  • Replaced commentModeSelector which has expensive logic inside the selector itself that ran on every state change with a useCommentMode that only performs the calculation on when dependencies are changed.
  • update selected widget state only when a needed instead of updating redux state on every action.

Fixes #12938

Type of change

  • Performance improvement

How Has This Been Tested?

Manual UI and all existing tests should pass.

Checklist:

  • [x] My code follows the style guidelines of this project
  • [x] I have performed a self-review of my own code
  • [x] I have commented my code, particularly in hard-to-understand areas
  • [ ] I have made corresponding changes to the documentation
  • [x] My changes generate no new warnings
  • [ ] I have added tests that prove my fix is effective or that my feature works
  • [x] New and existing unit tests pass locally with my changes

ashit-rath avatar Jun 13 '22 08:06 ashit-rath

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
appsmith ✅ Ready (Inspect) Visit Preview Aug 17, 2022 at 7:22AM (UTC)

vercel[bot] avatar Jun 13 '22 08:06 vercel[bot]

/ok-to-test sha=4d9cec6

ashit-rath avatar Jun 13 '22 08:06 ashit-rath

Unable to find test scripts. Please add necessary tests to the PR.

github-actions[bot] avatar Jun 13 '22 09:06 github-actions[bot]

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2487274596. Workflow: Appsmith External Integration Test Workflow. Commit: 4d9cec6. PR: 14485.

github-actions[bot] avatar Jun 13 '22 09:06 github-actions[bot]

/ok-to-test sha=8027618

ashit-rath avatar Jun 13 '22 09:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2487468931. Workflow: Appsmith External Integration Test Workflow. Commit: 8027618. PR: 14485.

github-actions[bot] avatar Jun 13 '22 09:06 github-actions[bot]

/ok-to-test sha=28fb4fc

ashit-rath avatar Jun 17 '22 09:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2514708158. Workflow: Appsmith External Integration Test Workflow. Commit: 28fb4fc. PR: 14485.

github-actions[bot] avatar Jun 17 '22 09:06 github-actions[bot]

/ok-to-test sha=1daa9fb

ashit-rath avatar Jun 17 '22 12:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2515464110. Workflow: Appsmith External Integration Test Workflow. Commit: 1daa9fb. PR: 14485.

github-actions[bot] avatar Jun 17 '22 12:06 github-actions[bot]

/ok-to-test sha=f08fc55

ashit-rath avatar Jun 20 '22 12:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2529033095. Workflow: Appsmith External Integration Test Workflow. Commit: f08fc55. PR: 14485.

github-actions[bot] avatar Jun 20 '22 12:06 github-actions[bot]

/ok-to-test sha=f196fb9

ashit-rath avatar Jun 20 '22 13:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2529398964. Workflow: Appsmith External Integration Test Workflow. Commit: f196fb9. PR: 14485.

github-actions[bot] avatar Jun 20 '22 13:06 github-actions[bot]

UI Performance test run logs and artifacts: https://github.com/appsmithorg/appsmith/actions/runs/2529398964. Commit: f196fb9. Results:

Click to view performance test results

Run 1 Run 2 Run 3 Run 4 Run 5 Median Mean SD.Sample SD.Population
SELECT_CATEGORY
scripting 659.55 628.92 1839.66 657.88 727.49 659.55 902.7 58.16 52.02
painting 6.47 7.41 5.4 8.24 7.45 7.41 6.99 15.59 13.88
rendering 387.44 327.27 325.65 417.99 400.65 387.44 371.8 11.51 10.29
BIND_TABLE_DATA
scripting 2088.14 2023.73 2312.89 2265.47 2301.97 2265.47 2198.44 6.06 5.42
painting 21.76 21.7 23.48 25.2 20.78 21.76 22.58 7.79 6.95
rendering 1113.54 1212.98 1011.35 1011.45 845.32 1011.45 1038.93 13.17 11.78
CLICK_ON_TABLE_ROW
scripting 3174.95 2690.01 1622.33 1719.56 1489.83 1719.56 2139.34 34.99 31.29
painting 53.23 26.84 19.77 16.32 23.27 23.27 27.89 52.71 47.15
rendering 1182.89 1256.17 472.1 486.73 497.8 497.8 779.14 51.72 46.26
UPDATE_POST_TITLE
scripting 3389.68 2979.21 2656.9 2846.82 2391.75 2846.82 2852.87 13.06 11.68
painting 19.94 24.56 20.8 31.57 21.82 21.82 23.74 19.84 17.73
rendering 507.79 538.22 463.97 510.19 447.11 507.79 493.46 7.52 6.73
OPEN_MODAL
scripting 1355.22 1396.96 1295.55 1221.95 1086.99 1295.55 1271.33 9.62 8.60
painting 17.27 12.2 11.87 15.78 18.2 15.78 15.06 19.26 17.20
rendering 565.66 548.12 527.47 507.79 455.58 527.47 520.92 8.16 7.30
CLOSE_MODAL
scripting 843.85 698.22 729.82 667.71 703.7 703.7 728.66 9.34 8.36
painting 6.24 7.44 18.15 5.73 12.63 7.44 10.04 52.79 47.21
rendering 445.1 463.73 452.32 448.48 412.2 448.48 444.37 4.34 3.88
SELECT_WIDGET_MENU_OPEN
scripting 1612.83 1584.7 1803.08 1843.04 1835.22 1803.08 1735.77 7.28 6.51
painting 10.45 8.51 20.61 13.49 17.45 13.49 14.1 35.18 31.49
rendering 618.11 619.87 825.68 674.67 679.63 674.67 683.59 12.38 11.07
SELECT_WIDGET_SELECT_OPTION
scripting 264.05 276.95 370.64 327.75 386.7 327.75 325.22 16.79 15.01
painting 4.22 8.09 13.01 5.34 3.29 5.34 6.79 57.73 51.55
rendering 18.93 23.01 35.46 24.71 26.03 24.71 25.63 23.84 21.34

github-actions[bot] avatar Jun 20 '22 14:06 github-actions[bot]

/ok-to-test sha=49dd097

ashit-rath avatar Jun 21 '22 03:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2532850661. Workflow: Appsmith External Integration Test Workflow. Commit: 49dd097. PR: 14485.

github-actions[bot] avatar Jun 21 '22 03:06 github-actions[bot]

UI Performance test run logs and artifacts: https://github.com/appsmithorg/appsmith/actions/runs/2532850661. Commit: 49dd097. Results:

Click to view performance test results

Run 1 Run 2 Run 3 Run 4 Run 5 Median Mean SD.Sample SD.Population
SELECT_CATEGORY
scripting 654.2 562.81 518.98 521.28 554.37 554.37 562.33 9.77 8.74
painting 6.51 3.87 15.19 14.83 7.45 7.45 9.57 53.71 48.07
rendering 329.61 290.03 291.61 299.77 282.51 291.61 298.71 6.14 5.49
BIND_TABLE_DATA
scripting 2344.59 2269.99 2318.46 2100.28 2276.35 2276.35 2261.93 4.22 3.77
painting 14.76 12.84 18.73 12.21 14.72 14.72 14.65 17.34 15.56
rendering 796.39 780.6 1022.56 1100.17 879.66 879.66 915.88 15.37 13.74
CLICK_ON_TABLE_ROW
scripting 1649.41 1479.86 1697.62 1661 1867.3 1661 1671.04 8.27 7.39
painting 18.83 12.92 38.66 13.41 19.22 18.83 20.61 50.99 45.61
rendering 425.01 407.51 433.58 448.92 558.04 433.58 454.61 13.14 11.75
UPDATE_POST_TITLE
scripting 2442.77 2510.93 2198.13 2409.92 2765.93 2442.77 2465.54 8.30 7.42
painting 19.56 20.41 13.06 17.98 28.26 19.56 19.85 27.66 24.74
rendering 414 414.2 381.44 414.22 442.44 414.2 413.26 5.23 4.68
OPEN_MODAL
scripting 1107.04 1160.19 1131.1 1084.1 1185.84 1131.1 1133.65 3.58 3.20
painting 15.8 11.88 12.58 14.89 11.47 12.58 13.32 14.34 12.84
rendering 489.87 472.87 480.21 517.86 496.09 489.87 491.38 3.51 3.14
CLOSE_MODAL
scripting 518.67 748.65 2063.39 990.15 878.7 878.7 1039.91 57.55 51.47
painting 8.75 14.54 5.68 11.07 9.35 9.35 9.88 32.89 29.45
rendering 358.13 455.31 518.19 543.19 477.39 477.39 470.44 15.20 13.60
SELECT_WIDGET_MENU_OPEN
scripting 1676.8 1550.21 1507.66 1658.28 1601.73 1601.73 1598.94 4.46 3.98
painting 9.36 7.93 11.1 9.04 9.67 9.36 9.42 12.21 10.83
rendering 634.22 549.16 549.93 668.58 548.78 549.93 590.13 9.70 8.67
SELECT_WIDGET_SELECT_OPTION
scripting 255.68 286.8 244.26 339.94 313.48 286.8 288.03 13.79 12.33
painting 6.84 3.81 3.09 5.51 3.06 3.81 4.46 37.22 33.41
rendering 16.67 16.26 17.46 16.66 17.63 16.67 16.94 3.42 3.07

github-actions[bot] avatar Jun 21 '22 04:06 github-actions[bot]

/ok-to-test sha=749af42

ashit-rath avatar Jun 21 '22 10:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2534655045. Workflow: Appsmith External Integration Test Workflow. Commit: 749af42. PR: 14485.

github-actions[bot] avatar Jun 21 '22 10:06 github-actions[bot]

/ok-to-test sha=52a3e8e

ashit-rath avatar Jun 21 '22 13:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2535581223. Workflow: Appsmith External Integration Test Workflow. Commit: 52a3e8e. PR: 14485.

github-actions[bot] avatar Jun 21 '22 13:06 github-actions[bot]

Deployment failed with the following error:

Resource is limited - try again in 40 minutes (more than 100, code: "api-deployments-free-per-day").

vercel[bot] avatar Jun 22 '22 08:06 vercel[bot]

Deployment failed with the following error:

Resource is limited - try again in 33 minutes (more than 100, code: "api-deployments-free-per-day").

vercel[bot] avatar Jun 22 '22 08:06 vercel[bot]

/ok-to-test sha=d39c970

ashit-rath avatar Jun 22 '22 08:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2541116354. Workflow: Appsmith External Integration Test Workflow. Commit: d39c970. PR: 14485.

github-actions[bot] avatar Jun 22 '22 09:06 github-actions[bot]

/ok-to-test sha=cbcfbbc

ashit-rath avatar Jun 22 '22 09:06 ashit-rath

Tests running at: https://github.com/appsmithorg/appsmith/actions/runs/2541520369. Workflow: Appsmith External Integration Test Workflow. Commit: cbcfbbc. PR: 14485.

github-actions[bot] avatar Jun 22 '22 10:06 github-actions[bot]

UI Performance test run logs and artifacts: https://github.com/appsmithorg/appsmith/actions/runs/2541520369. Commit: cbcfbbc. Results:

Click to view performance test results

Run 1 Run 2 Run 3 Run 4 Run 5 Median Mean SD.Sample SD.Population
SELECT_CATEGORY
scripting 920.15 1897.6 1960.32 879.92 982.73 982.73 1328.14 41.42 37.05
painting 5.31 8.78 9.47 6.75 5.31 6.75 7.12 27.11 24.30
rendering 1077.2 1111.08 1041.01 1104.2 1123.94 1104.2 1091.49 3.02 2.70
BIND_TABLE_DATA
scripting 1957.76 1884.34 1902.89 1890.71 1914.4 1902.89 1910.02 1.52 1.36
painting 10.32 12.22 11.4 13.8 14.67 12.22 12.48 14.10 12.66
rendering 1199.92 1164.42 1160.75 1155.87 1255.79 1164.42 1187.35 3.54 3.17
CLICK_ON_TABLE_ROW
scripting 4276.78 5179.16 4143.55 4501.23 4579.22 4501.23 4535.99 8.80 7.87
painting 22.51 25.3 24.47 18.39 20.09 22.51 22.15 13.14 11.74
rendering 6771.09 6942.91 6659.94 6994.14 6666.23 6771.09 6806.86 2.28 2.04
UPDATE_POST_TITLE
scripting 6658.59 5915.22 4142.29 5808.73 6544.19 5915.22 5813.8 17.31 15.48
painting 28.53 16.27 13.78 18 29.97 18 21.31 34.82 31.16
rendering 12549.69 9151.44 8405.74 10749.46 8901.44 9151.44 9951.55 17.05 15.25
OPEN_MODAL
scripting 1805.49 1621.81 1762.17 1854.97 1792.44 1792.44 1767.38 4.98 4.45
painting 9.25 11.61 9.41 10.75 13.35 10.75 10.87 15.55 13.89
rendering 3069.05 3049.05 3104.74 3092.73 3125.09 3092.73 3088.13 0.97 0.86
CLOSE_MODAL
scripting 958.35 1486.94 3590.62 989.04 1131.79 1131.79 1631.35 68.36 61.14
painting 5.08 4.74 4.02 5.15 5.21 5.08 4.84 10.12 9.09
rendering 1629.54 1551.69 1599.08 1589.2 1570.33 1589.2 1587.97 1.86 1.66
SELECT_WIDGET_MENU_OPEN
scripting 1289.78 1295.71 1322.64 1270.66 1317.06 1295.71 1299.17 1.63 1.45
painting 7.02 5.44 10.91 9.68 12.25 9.68 9.06 30.91 27.59
rendering 645.73 618.92 616.31 621.46 611.79 618.92 622.84 2.13 1.91
SELECT_WIDGET_SELECT_OPTION
scripting 201.54 133.45 194.22 142.43 117.43 142.43 157.81 23.91 21.39
painting 2.39 6.96 2.05 1.82 4.35 2.39 3.51 61.82 55.27
rendering 11.97 11.31 11.37 10.38 9.67 11.31 10.94 8.32 7.40

github-actions[bot] avatar Jun 22 '22 11:06 github-actions[bot]

Deployment failed with the following error:

Resource is limited - try again in 13 minutes (more than 100, code: "api-deployments-free-per-day").

vercel[bot] avatar Jun 24 '22 05:06 vercel[bot]