Lighthouse Performance Improvement

[somudas]

1. Home Page:

Desktop: 97%

Improvements:

• NA

Mobile: 86%

Improvements:

• Reduce initial server response time
• Properly size images

2. Blogs page:

Desktop: 88-89%

Improvements:

• Add alt attributes in image tag

Author text should be in h3 not h4

Image and text have discrete boundary in between them and they should be put inside a card which is clickable.

Mobile: 33-37%

Improvements:

Some images are not centre aligned.

3. JavaScript Blog page:

Mobile: 66%

Improvements:

Don't Use passive listeners to improve scrolling performance

Add iframe and frame titles

Desktop: 67%

Improvements: same as above

4. Team Page:

Desktop: 63%

Improvements:

• Navbar blocks the H1 heading
• Script evaluation takes 1922ms. Hence needs to be optimised! (Reduce unused javascript)

Mobile: 39%

Improvements:

• Hamburger menu collides with the description text and the H1 heading has very little to zero top margin in some mobile resolutions.
• Reduce unused javascript.
• Proposed solution would be a separate top navbar which will hold the hamburger menu.

5. About Us:

Desktop: 74%

Improvements:

• "CSAW 2021" should be in H2

Mobile: 73%

Improvements:

• Does not use passive listeners to improve scrolling experience

• The navigation buttons are not clearly visible in mobile view hence affecting accessibility.

6. Contact Us:

Desktop: 70%

Mobile: 57%

Improvements:

• Add a passive flag to the event listeners to improve the page's scroll performance. (https://web.dev/uses-passive-event-listeners for reference).

• Can use the nuxt/image component and specify explicit width and height to reduce layout shifts and improve CLS.
  

• Link text (and alternate text for images, when used as links) should be made discernible, unique, and focusable to improve the navigation experience for screen reader users.

• Usage of deprecated API: window.webkitStorageInfo is deprecated. Please use navigator.webkitTemporaryStorage or navigator.webkitPersistentStorage instead.

• Serve static assets with an efficient cache: A long cache lifetime can speed up repeat visits to your page.

Common Issues:

• Minimize main-thread work and consider reducing the time spent parsing, compiling and executing JS.
• Time to Interactive and speed index is much larger (for nearly all pages):
• Errors must not be logged to console: