[v5] Calling render while an existing render is happening causes force layout to flash

[louisch]

Describe the bug / 问题描述

It is possible to not await graph.render and call it while another render is already happening. This results in strange results such as the force layout flashing between multiple layouts running simultaneously.

This is unlikely a problem in well structured code, but in more complex code, especially in React, you can end up accidentally calling graph.render in rapid succession for one reason or another.

I'm not sure this is something g6 needs to address directly, but at the very least a warning in the documentation, or some code to detect and print a warning in the console, would be nice.

As a note, as a user, you can fix this by implementing some sort of lock around the graph.render method yourself, or debouncing the graph.render method. (If you cannot stop your code from calling graph.render multiple times)

Reproduction link / 重现链接

https://codesandbox.io/p/sandbox/g6-react-forked-8dnk5w

Steps to Reproduce the Bug or Issue / 重现步骤

On loading the sandbox the layout flashes

Also, on clicking the Add Node button, the layout can flash as well

G6 Version / G6 版本

🆕 5.0.7

Operating System / 操作系统

macOS

Browser / 浏览器

Chrome, Firefox

Additional context / 补充说明

No response

[Aarebecca]

We did find quite a few similar issues in React, such as Graph instances being created and immediately destroyed in strict mode.

But I don't think this kind of special handling needs to be done by G6. A better solution might be to wrap a G6 React to handle the various problems you have to face in React (e.g., Graphin).