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

Visual Editor redraw problem (performance) #1496

Closed
7 tasks
yeze322 opened this issue Nov 5, 2019 · 4 comments
Closed
7 tasks

Visual Editor redraw problem (performance) #1496

yeze322 opened this issue Nov 5, 2019 · 4 comments
Assignees
@yeze322
Labels
Area: Visual editor P0 Must Fix. Release-blocker R7 Release 7 - December 10th, 2019 Type: Engineering

Comments

@yeze322
Copy link
Contributor

yeze322 commented Nov 5, 2019 •
edited
Loading

Describe the bug

Visual Editor shouldn't redraw the whole element tree when operating on it. We should optimize the rendering performance to avoid frequent redraw.

We can focus on optimizing two scenarios for now:

  1. click on a node will render twice
  2. change focus state will redraw other nodes

Version

What version of the Composer are you using? Paste the build SHA found on the about page (/about).

Browser

What browser are you using?

  • Chrome
  • Safari
  • Firefox
  • Edge

OS

What operating system are you using?

  • macOS
  • Windows
  • Ubuntu

To Reproduce

Steps to reproduce the behavior:

  1. Go to '...'
  2. Click on '....'
  3. Scroll down to '....'
  4. See error

Expected behavior

Give a clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots/gif/video to help explain your problem.

Additional context

Add any other context about the problem here.
@yeze322 yeze322 added the Needs-triage A new issue that require triage label Nov 5, 2019
@hibrenda hibrenda added Area: Visual editor R7 Release 7 - December 10th, 2019 Type: Engineering and removed Needs-triage A new issue that require triage labels Nov 5, 2019
@yeze322
Copy link
Contributor Author

yeze322 commented Nov 5, 2019

Talking about redraw, it's always related to state management. I want to migrate to a redux-like style state management by leveraging useReducer hook in visual editor to get ride of heavy usage of useEffect hooks which is the root cause of unexpected redraw in visual editor.

With a centralized reducer, we can easily inspect which action triggers a redraw and it will be easier to do optimization based on that kind of data flow.

@cwhitten cwhitten added the P0 Must Fix. Release-blocker label Nov 6, 2019
@yeze322 yeze322 mentioned this issue Nov 19, 2019
Merged
9 tasks
@yeze322
Copy link
Contributor Author

yeze322 commented Nov 19, 2019

Addressed in #1601

cwhitten pushed a commit that referenced this issue Nov 19, 2019
@yeze322 @cwhitten
fix: misused 'useEffect' hook in Visual Editor (#1496) (#1601)
b98656b 
* update samples to fix demo data

* fix demo

* remove the misusing of useEffect hook

* remove outdated comments
@yeze322 yeze322 mentioned this issue Dec 11, 2019
Closed
@yeze322
Copy link
Contributor Author

yeze322 commented Feb 18, 2020

need one more fix

@yeze322 yeze322 reopened this Feb 18, 2020
@yeze322 yeze322 mentioned this issue Feb 18, 2020
Merged
@yeze322
Copy link
Contributor Author

yeze322 commented Feb 21, 2020

closed by #2000 ; track LG parts in #1755

@yeze322 yeze322 closed this as completed Feb 21, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@yeze322 yeze322

Labels
Area: Visual editor P0 Must Fix. Release-blocker R7 Release 7 - December 10th, 2019 Type: Engineering
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@cwhitten @yeze322 @hibrenda