search

TU-Wien-dataLAB / Grader-Labextension

BSD 3-Clause "New" or "Revised" License
3 stars 1 forks source link

Activating grading mode is slow #4

Closed meffmadd closed 6 months ago

meffmadd commented 8 months ago

Describe the bug For a notebook with a lot of cells, the rendering of the grading mode cells takes a lot of time (several seconds).

To Reproduce Steps to reproduce the behavior:

  1. Open large notebook
  2. Toogle grading mode
  3. Wait.....

Expected behavior Rendering a few inputs should be very fast. A quick performance analysis showed that according to Firefox, most of the time is spent on "Style computation". Maybe the page renders more often than it should.

meffmadd commented 8 months ago

The problem seems to be that we use quite complex MUI components for each of the elements. The code itself has no performance issues (widgets get iterated over in ~30ms) but the style computation takes very long (3-5s). When we return just plain HTML elements (e.g. <div><input/><input/></div>) the re-rendering takes only around 100ms.

We should therefore rewrite the notebook components without complex MUI components (Grid etc.) and instead use simple HTML elements with the correct JupyterLab CSS classes. This way we get dark mode for free and the components fit better into the notebook environment.

Also, we currently have a bug if the notebook windowing mode is set to "full". The grading switch disappears after toggling the grading mode.