netcreateorg / netcreate-2018

Please report bugs, problems, ideas in the project Issues page: https://github.com/netcreateorg/netcreate-2018/issues
Other
11 stars 2 forks source link

`markdown-react` significantly affects rendering. #139

Closed benloh closed 3 years ago

benloh commented 3 years ago

Using Low-end mobile emulation to throttle network and CPU, rending a 499 node NodeTable (H213FA2020Prokopios) takes about 14 seconds. Of those 14 seconds, 8.5 seconds is eaten up by the markdown-react component.

Removing it, or disabling it, or otherwise figuring out how to use it judiciously would significantly improve performance.

jdanish commented 3 years ago

Is there a way to flag a node as including markdown or not and then only pass it through the renderer if it has actual markdown? I believe it currently only re-renders those nodes if they are edited so it should only be the initial rendering that is slowed by the markdown component, right? Otherwise maybe putting an "include markdown" flag in the template is a good short-term solution since I like it for my small graphs but we might turn it off for these massive ones.

benloh commented 3 years ago

I'm not sure how we would detect if there's markdown...

The fact that this is being called so much suggests there is some other inefficiency at work.

Sounds like we need to invest the time on this one.

benloh commented 3 years ago

Testing...Commenting out the markdown component reduces rendering time on low-end mobile from 14s down to 4.5s.

kalanicraig commented 3 years ago

Seems like making it a flag in the template would give us flexibility. When we know it’ll be a big network we can turn it off.

On Tue, Sep 8, 2020 at 11:21 PM benloh notifications@github.com wrote:

Testing...Commenting out the markdown component reduces rendering time on low-end mobile from 14s down to 4.5s.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/netcreateorg/netcreate-2018/issues/139#issuecomment-689275083, or unsubscribe https://github.com/notifications/unsubscribe-auth/ACKL4NBCJMDNZ24KSIHYC43SE3YDJANCNFSM4RA3IEBA .

jdanish commented 3 years ago

I'm OK with the flag as a short-term solution as I like to use markdown in my smaller graphs like the CHAT one and yet I don't see it being used really in the larger graphs.

As for something more nuanced ... worst case, I'd think that when a node or edge gets saved, it can compare the returned markdown with the original text. If they differ, it can flip a flag to indicated "required MD" and if it is identical, then the opposite. If we save that with the nodes (including in the DB) then once one client has checked whether a node needs rendering, no one else will need to, and then only rendered nodes will require passing through the renderer. Of course, if every node detail of all 500 has MD it will still be slowed down, but at that point, I think that's OK. Just a thought - I am sure it is a bit more complicated than that.

benloh commented 3 years ago

59ccae17b9cc00d39177099d9fd21ac7b1e25235 improves performance by:

  1. Removing Markdown component to a separate class
  2. Only displaying the Markdown component if there is text.

Performance with "Low-end mobile" is now similar to performance without Markdown.