Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

VPN-6021: Improve "App Exculsions" screen load time by switching from Repeater to ListView #9131

Merged
merged 13 commits into from
Apr 9, 2024

Conversation

vinocher
Copy link
Contributor

@vinocher vinocher commented Feb 11, 2024

Description

The "App Exclusions" screen used a Repeater for the list items, which required all application names and their icons to be obtained when the screen was loaded. Obtaining icons is expensive, and slowed screen load. Switch this to ListView, which lazily loads list items as they become visible in the viewport. This allows icons to be obtained only when needed and improves screen load time.

The following additional changes were required to switch to ListView:

  1. The MZViewBase parent is a flickable and ListView is also a flickable. To prevent conflicts, the MZViewBase has been marked interactive:false.
  2. The ListView is implemented in MZList, with its own ensureVisible() which is used to scroll an item in the flickable into the visible part of the viewport.
  3. The controls before and after the list are moved into the ListView's header and footer, to allow the ListView flickable to scroll through all of them.
  4. Tab and Backtab navigation have been customized in places to account for the lazy loading of list items. The creation order of list items can no longer be depended upon for standard tabbing and this customization allows items to be navigated to by list index.

Reference

VPN-6021

Checklist

  • My code follows the style guidelines for this project
  • I have not added any packages that contain high risk or unknown licenses (GPL, LGPL, MPL, etc. consult with DevOps if in question)
  • I have performed a self review of my own code
  • I have commented my code PARTICULARLY in hard to understand areas
  • I have added thorough tests where needed

Copy link
Member

@lesleyjanenorton lesleyjanenorton left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

boundsBehavior: Flickable.StopAtBounds
highlightFollowsCurrentItem: true
Keys.onDownPressed: list.incrementCurrentIndex()
Keys.onUpPressed: list.decrementCurrentIndex()

ScrollBar.vertical: ScrollBar {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A nice follow-up would be to make this a component for easier keeping in sync with MZFlickable

@lesleyjanenorton lesleyjanenorton force-pushed the vinocher/appExclusionsScreenPerf branch from bf1dcd1 to 87e9a24 Compare April 9, 2024 19:16
@lesleyjanenorton lesleyjanenorton merged commit 0a0ffb6 into main Apr 9, 2024
127 of 129 checks passed
@lesleyjanenorton lesleyjanenorton deleted the vinocher/appExclusionsScreenPerf branch April 9, 2024 20:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants