Skip to content

Draft: Load user popover dependencies only when necessary

Nicolas Dular requested to merge 246533-load-user-popover-only-when-needed into master

What does this MR do?

This loads user_popovers.js's dependencies only when there is a .js-user-link. This is a ~40kb reduction in main.js, see bundle size analyzis.

Update The performance statistics indicate that this MR would increase performance on the Project and Issue page, but degrade performance on a MR page. More on that in the following thread: !47677 (comment 457547530). We've decided to not merge it at the current state, because we don't see an improvement on all pages, and especially the MR page is the slowest of these three.

Why is this not improving performance? A few thoughts:

  • Before this MR, the user_avatar was loaded in main.js bundle with user_popover, which would be no longer the case and needs to be loaded on every page separately
  • With this MR, we generate a initPopover and a vendor-initPopover chunk. It would be interesting to know why webpack does this and if it would be valuable to prevent

Ideas how to improve this MR:

  • Maybe it's worth putting user_avatar back in main.js
  • Maybe we can only load user_popover on mouseover instead of when a .js-user-link class is present.

Screenshots (strongly suggested)

User Popover on page User Popover on markdown preview
Screenshot_2020-11-13_at_17.59.43 Screenshot_2020-11-13_at_18.00.10

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • 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 #246533

Edited by Nicolas Dular

Merge request reports

Loading