Skip to content
This repository was archived by the owner on Apr 21, 2025. It is now read-only.
This repository was archived by the owner on Apr 21, 2025. It is now read-only.

Possible improvement of app performance inside the home page #2051

@NicolasPotesG

Description

@NicolasPotesG

Summary

An analysis of the performance of the application was carried out and on the home page a certain Jank (slow frame) could be perceived that can affect the user experience and produce possible GUI lagging. Possibly this is due to the loading of several images (SVG) and loading of many elements.

Desired Solution

You can preload the images (SVG) used in the header, in the Protect yourself section, in the donate section and the images of that page (home) using the precachePicture function of the flutter_svg library that can be obtained in pub.dev, with a Future.wait[] you can preload all the images in picture cache making use of this function in a file that is executed before than the home page (for example, main.dart). Additionally, in the ScrollView used for the cards in the Protect yourself section of this same page you can use the lazy_load_scrollview library also obtained from pub.dev which allows lazy loading, i.e. only the visible portion of the cards is built at startup time.
These changes can improve the performance of the application in this page that loads so many elements and images.

Additional Context

Below is a possible implementation that can be applied in the code in main.dart to preload some images from home.dart (based on the above):
image

To preload images like the following (image used in the donate section of home):
image

Additionally, the ScrollView found in the Protect yourself section could be wrapped with the LazyLoadScrollView:
image

It is worth mentioning that these are suggestions that can be replaced with other suggestions that will improve the performance of the application much more. The important thing to note is that the application can have poor performance due to rendering many images and elements at the same time on a page.

Checklist:

  • Check the Home page inside the repository and identify each of the components and their images.
  • Check this open issue in GitHub community.
  • Check the library flutter_svg and its precachePicture function in pub.dev.
  • Check the library lazy_load_scrollview in pub.dev.

Metadata

Metadata

Assignees

No one assigned

    Labels

    needs:triageNew issue that needs triageresolved:staleNo recent activity on the issue or PRsource:publicIssues created by the public

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions