Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

perf(editor): Improve canvas rendering performance #8022

Merged
merged 3 commits into from Dec 14, 2023
Merged

perf(editor): Improve canvas rendering performance #8022

merged 3 commits into from Dec 14, 2023

Conversation

OlegIvaniv
Copy link
Contributor

@OlegIvaniv OlegIvaniv commented Dec 13, 2023 •
edited

Summary

  • Refactor usage of setSuspendDrawing, removing it from loops and only calling it after batch operations are done
  • Batch adding of nodes to improve copy/paste and workflow load performance
  • Cache i18n calls
  • Debounce connections dragging handler if there are more than 20 nodes

Related tickets and issues

Include links to Linear ticket or Github issue or Community forum post. Important in order to close automatically and provide context to reviewers.

@OlegIvaniv
⚡️Improve canvas nodes rendering performance
3881b4d 
Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>
@OlegIvaniv OlegIvaniv marked this pull request as ready for review December 13, 2023 21:25
@OlegIvaniv OlegIvaniv closed this Dec 13, 2023
@OlegIvaniv OlegIvaniv reopened this Dec 13, 2023
@OlegIvaniv OlegIvaniv changed the title performance(editor): Improve canvas rendering performance perf(editor): Improve canvas rendering performance Dec 13, 2023
@cypress Cypress
Copy link

cypress bot commented Dec 13, 2023 •
edited

Passing run #3338 ↗︎

0 294 5 0 Flakiness 0

Details:

🌳 🖥️ browsers:node18.12.0-chrome107 🤖 OlegIvaniv 🗃️ e2e/*
Project: n8n Commit: 2c90fa2273
Status: Passed Duration: 06:27 💡
Started: Dec 14, 2023 10:49 AM Ended: Dec 14, 2023 10:55 AM

Review all test suite changes for PR #8022 ↗︎

@OlegIvaniv
🐛 Remove connections batch-add delay
d9e2a71 
Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>
@n8n-assistant n8n-assistant bot added n8n team Authored by the n8n team ui Enhancement in /editor-ui or /design-system labels Dec 14, 2023
@OlegIvaniv
Remove debugging logs
2c90fa2 
Signed-off-by: Oleg Ivaniv <me@olegivaniv.com>
@github-actions GitHub Actions
Copy link
Contributor

✅ All Cypress E2E specs passed

@OlegIvaniv OlegIvaniv merged commit b780436 into master Dec 14, 2023
19 checks passed
@OlegIvaniv OlegIvaniv deleted the canvas_render_performance branch December 14, 2023 11:01
MiloradFilipovic added a commit that referenced this pull request Dec 15, 2023
@MiloradFilipovic
Merge branch 'master' into ADO-1546-lead-enrichment-components
68b5993 
* master:
  refactor(core): Warn on sqlite DB detected during init on queue mode (#8034)
  docs: Two small UI copy fixes in sub-nodes (#8032)
  fix(core): Restore workflow ID during execution creation (#8031)
  fix(core): Initialize queue once in queue mode (#8025)
  fix(editor): Add back credential `use` permission (#8023)
  fix(editor): Disable auto scroll and list size check when clicking on executions (#7983)
  fix(editor): Fix dialogVisibleChanged hooks event when meta.value is undefined (no-changelog) (#7986)
  perf(editor): Improve canvas rendering performance (#8022)
@github-actions github-actions bot mentioned this pull request Dec 21, 2023
Merged
ivov added a commit that referenced this pull request Dec 21, 2023
@github-actions @ivov
🚀 Release 1.22.0 (#8115)
b67b5ae 
#
[1.22.0](https://github.com/n8n-io/n8n/compare/n8n@1.21.0...n8n@1.22.0)
(2023-12-21)


### Bug Fixes

* **core:** Close db connection gracefully when exiting
([#8045](#8045))
([e69707e](e69707e))
* **core:** Consider timeout in shutdown an error
([#8050](#8050))
([4cae976](4cae976))
* **core:** Do not display error when stopping jobless execution in
queue mode ([#8007](#8007))
([8e6b951](8e6b951))
* **core:** Fix shutdown if terminating before hooks are initialized
([#8047](#8047))
([6ae2f5e](6ae2f5e))
* **core:** Handle multiple termination signals correctly
([#8046](#8046))
([67bd8ad](67bd8ad))
* **core:** Initialize queue once in queue mode
([#8025](#8025))
([53c0b49](53c0b49))
* **core:** Prevent axios from force setting a form-urlencoded
content-type ([#8117](#8117))
([bba9576](bba9576))
* **core:** Remove circular references before serializing executions in
public API ([#8043](#8043))
([989888d](989888d))
* **core:** Restore workflow ID during execution creation
([#8031](#8031))
([c5e6ba8](c5e6ba8))
* **core:** Use relative imports for dynamic imports in
SecurityAuditService ([#8086](#8086))
([785bf99](785bf99))
* **core:** Stop binary data restoration from preventing execution from
finishing ([#8082](#8082))
([5ffff1b](5ffff1b))
* **editor:** Add back credential `use` permission
([#8023](#8023))
([329e5bf](329e5bf))
* **editor:** Cleanup Executions page component
([#8053](#8053))
([2689c37](2689c37))
* **editor:** Disable auto scroll and list size check when clicking on
executions ([#7983](#7983))
([fcb8b91](fcb8b91))
* **editor:** Ensure execution data overrides pinned data when copying
in executions view ([#8009](#8009))
([1d1cb0d](1d1cb0d))
* **editor:** Fix copy/paste issue when switch node is in workflow
([#8103](#8103))
([4b86926](4b86926))
* **editor:** Make keyboard shortcuts more strict; don't accept extra
Ctrl/Alt/Shift keys ([#8024](#8024))
([8df49e1](8df49e1))
* **editor:** Show credential share info only to appropriate users
([#8020](#8020))
([b29b4d4](b29b4d4))
* **editor:** Turn off executions list auto-refresh after leaving the
page ([#8005](#8005))
([e3c363d](e3c363d))
* **editor:** Update image sizes in template description not to be full
width always ([#8037](#8037))
([63a6e7e](63a6e7e))
* **ActiveCampaign Node:** Fix pagination issue when loading tags
([#8017](#8017))
([1943857](1943857))
* **HTTP Request Node:** Do not create circular references in HTTP
request node output ([#8030](#8030))
([5b7ea16](5b7ea16))
* Upgrade axios to address CVE-2023-45857
([#7713](#7713))
([64eb9bb](64eb9bb))


### Features

* Add option to `returnIntermediateSteps` for AI agents
([#8113](#8113))
([7806a65](7806a65))
* **core:** Add config option to prefer GET request over LIST when using
Hashicorp Vault ([#8049](#8049))
([439a22d](439a22d))
* **core:** Add N8N_GRACEFUL_SHUTDOWN_TIMEOUT env var
([#8068](#8068))
([614f488](614f488))
* **editor:** Add lead enrichment suggestions to workflow list
([#8042](#8042))
([36a923c](36a923c))
* **editor:** Finalize workers view
([#8052](#8052))
([edfa784](edfa784))
* **editor:** Gracefully ignore invalid payloads in postMessage handler
([#8096](#8096))
([9d22c7a](9d22c7a))
* **editor:** Upgrade frontend tooling to address a few vulnerabilities
([#8100](#8100))
([19b7f1f](19b7f1f))
* **Filter Node:** Overhaul UI by adding the new filter component
([#8016](#8016))
([3d53052](3d53052))
* **Respond to Webhook Node:** Overhaul with improvements like returning
all items ([#8093](#8093))
([32d397e](32d397e))


### Performance Improvements

* **editor:** Improve canvas rendering performance
([#8022](#8022))
([b780436](b780436))

Co-authored-by: ivov <ivov@users.noreply.github.com>
@janober
Copy link
Member

janober commented Dec 21, 2023

Got released with n8n@1.22.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@alexgrozav alexgrozav alexgrozav approved these changes

Assignees
No one assigned
Labels
n8n team Authored by the n8n team Released ui Enhancement in /editor-ui or /design-system
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
3 participants
@OlegIvaniv @janober @alexgrozav