Speed up loading and rendering of diffs.
Review Request #8892 — Created April 10, 2017 and submitted
When working with large diffs, there's slowdown when injecting the HTML for the diff and setting it up. As part of the setup, we make some CSS changes to elements in the rendered diff, and if the browser is bogged down rendering a large diff, this can just slow things down further. To deal with this, we now hide the parent of the rendered diff and then manually inject the HTML using the innerHTML attribute, instead of going through jQuery (which is going to be slower for this operation, in our case), re-showing the element when we're finished the render. This speeds up diff load times a fair amount.
Loaded several diffs, small and large. Timed performance and saw
noticeable improvements with large diffs.
-
-
reviewboard/static/rb/js/pages/views/diffViewerPageView.js (Diff revision 1) Can you include a comment explaining why we're avoiding using jquery to attach the HTML?
Change Summary:
Added a comment around the diff HTML setting changes, explaining why we're using
innerHTML
directly.
Commit: |
|
||||
---|---|---|---|---|---|
Diff: |
Revision 2 (+18 -3) |
Checks run (3 succeeded)
JSHint
passed.
PEP8 Style Checker
passed.
Pyflakes
passed.
-
-
reviewboard/static/rb/js/diffviewer/views/diffReviewableView.js (Diff revision 2) This doesn't seem like it's really meant to be part of this change.
Change Summary:
Update the parent width logic to only conditionally fetch the grandparent, with a comment about the logic.
Commit: |
|
||||
---|---|---|---|---|---|
Diff: |
Revision 3 (+29 -4) |
Checks run (3 succeeded)
JSHint
passed.
PEP8 Style Checker
passed.
Pyflakes
passed.