IntersectMBO / IntersectMBO/govtool

Suggestion to improve performance of the app

Open
#1,409 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
HTML
Stars
21
Forks
29
Avg merge
2d 22h
Merged PRs (30d)
7

Description

# Current Performance Result of the App![image](https://github.com/IntersectMBO/govtool/assets/43606623/19343ff4-52c0-4dfd-bbbd-0b4e0a435445)

## 1. Reduce JavaScript Execution Time (1.6 sec)
- **Issue**: The app spends a significant amount of time parsing, compiling, and executing JavaScript.
- **Suggestion**: Deliver smaller JavaScript payloads to reduce execution time.
- **Reference**: [Learn how to reduce JavaScript execution time](https://developer.chrome.com/docs/lighthouse/performance/bootup-time/?utm_source=lighthouse&utm_medium=cli).

## 2. Minimize Main Thread Work (2.6 sec)
- **Issue**: Excessive time is spent on the main thread for parsing, compiling, and executing JavaScript.
- **Suggestions**:
- Reduce the size of JavaScript payloads.
- Optimize script evaluation to minimize time on the main thread.
- **Reference**: [Learn how to minimize main-thread work](https://developer.chrome.com/docs/lighthouse/performance/mainthread-work-breakdown/?utm_source=lighthouse&utm_medium=cli).
- **Screenshot**:
![image](https://github.com/IntersectMBO/govtool/assets/43606623/f050b3b2-73e7-4f02-af3c-932497822eda)

## 3. Improve Largest Contentful Paint (LCP) Element (29.83 sec)
- **Issue**: The largest contentful element takes too long to paint.
- **Suggestion**: Optimize the loading and rendering of the largest contentful element.
- **Caused by element**:
```html
bg-orange```
- **Reference:** [Learn more about the Largest Contentful Paint element](https://developer.chrome.com/docs/lighthouse/performance/lighthouse-largest-contentful-paint/?utm_source=lighthouse&utm_medium=cli).

## 4. Reduce Unused JavaScript Code
- **Issue**: Unused JavaScript is increasing network activity and page load time.
- **Suggestion**: Defer loading scripts until they are required.
- **Example**:
- Script: /assets/index-ebf1e583.js
- **Reference**: [Learn how to reduce unused JavaScript](https://developer.chrome.com/docs/lighthouse/performance/unused-javascript/?utm_source=lighthouse&utm_medium=cli).

## 5. Properly Size Images
- **Issue**: Images are not appropriately sized, increasing load times and data usage.
- **Suggestion**: Serve images that are correctly sized for their container.
- **Images to Optimize**:
- /images/BGOrange.png
- /images/BGBlue.png
- /images/HeroImage.png
- /images/SanchoLogo.png

## 6. Eliminate Render-Blocking Resources
- **Issue**: Some resources are blocking the first paint of the page.
- **Suggestion**: Deliver critical JavaScript/CSS inline and defer non-critical resources.
- **Example**:
- Resource: /css2?family=…(fonts.googleapis.com)
- **Reference**: [Learn how to eliminate render-blocking resources](https://developer.chrome.com/docs/lighthouse/performance/render-blocking-resources/?utm_source=lighthouse&utm_medium=cli).

## 7. Avoid Enormous Network Payloads
- **Issue**: Large network payloads are slowing down the page load time.
- **Suggestion**: Reduce the size of large assets.
- **Assets to Optimize**:
- /assets/index-ebf1e583.js (3,635.8 KiB)
- /images/BGOrange.png (1,438.3 KiB)
- /images/BGBlue.png (1,080.8 KiB)
- /images/HeroImage.png (433.0 KiB)
- /images/SanchoLogo.png (10.5 KiB)
- /images/ProposeGovAction.png (10.3 KiB)
- /images/GovActionDelegate.png (8.7 KiB)
- /images/GovActionList.png (8.2 KiB)
- [fonts.gstatic.com: .woff2 files](https://fonts.gstatic.com)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.