Skip to content

Use pagination to load epics in roadmap

Kushal Pandya requested to merge 299814-add-roadmap-pagination into master

What does this MR do?

Note: Changes of this MR are behind feature flag :performance_roadmap. See the roll-out issue #337198 (closed) to learn more.

Use pagination via IntersectionObserver to load epics in the roadmap on scroll instead of loading all epics at once, thus considerably reducing the time it takes for roadmap page to load initially by speeding up both; GraphQL fetch and roadmap app initialization. This MR sets page size to 50 but we can change it to any limit we want, although less is better.

How to test it locally?

Here are the steps;

  1. You'd first need to have a group in GDK that has more than 50 epics. We have a script that can create epics in bulk, so follow the guide present in the script snippet.
  2. Once you have over 50 epics, enable feature flag for the group by running Feature.enable(:performance_roadmap, Group.find_by_full_path('<your-group-full-path>')) in Rails console.
  3. Visit Roadmap page for the group on GDK and it should load items with pagination.

Screencast

Roadmap

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

Does this MR contain changes to processing or storing of credentials or tokens, authorization and authentication methods or other items described in the security review guidelines? If not, then delete this Security section.

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team

Related to #299814

Edited by Kushal Pandya

Merge request reports