• 
      

    Wait until page elements are rendered before showing page content.

    Review Request #13201 — Created Aug. 10, 2023 and submitted — Latest diff uploaded

    Information

    Review Board
    release-6.x

    Reviewers

    We have UI elements that are dynamically set up as the page is loading.
    Historically, we've let these pop in and out of existence during page
    load, which doesn't look particularly great. This is very noticeable
    with the review banner, and previously the draft banners, which both
    show up and set up layout after the content below is shown.

    We solved this problem once before for full-viewport pages, like the
    dashboard, and are taking basically the same approach now. We now hide
    the #page-container element until after we've finished render. The
    page header bar will remain visible while the rest of the page loads.

    This isn't very noticeable in production, with compiled, cached
    JavaScript.

    The approach for full-viewport pages used display: block, wheraes now
    we use visibility: hidden. This ensures that content can lay out
    elements with appropriate bounding boxes, so there aren't any changes in
    render or layout.

    Tested the dashboard and datagrid pages, review request page, diff
    viewer, file attachment review UIs, and administration UI pages.

    Checked each type of page for any regressions in appearance.

    Verified that this prevents the initial page jump from banners and
    suddenly-appearing edit icons for review request fields.

    Commits

    Files