perf/a11y: Optimize website Lighthouse Performance and Accessibility scores (#1294) - #1626
Open
pratapashanmukhi wants to merge 1 commit into
Conversation
|
@pratapashanmukhi is attempting to deploy a commit to the shashankss1205's projects Team on Vercel. A member of the Team first needs to authorize it. |
Author
|
Hi maintainers! 👋 Could you please review these optimizations and approve the workflow runs/deployments for this PR? I have successfully built and tested the changes locally:
Thank you! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
This PR resolves #1294 by optimizing the website's initial loading performance and resolving key accessibility violations reported by Lighthouse.
Key Optimizations
1. Performance (Lighthouse Score target: 90+)
Index,Explore,PRReviewerPage,Privacy,NotFound) to dynamic imports usingReact.lazyandSuspense. This keeps heavy dependencies out of the initial load.CodeGraphViewercomponent. This prevents heavy graph libraries (Three.js, force graphs, Sigma, Web Tree Sitter) from loading when visitors land on the homepage.DemoSectionwith a static thumbnail facade, loading the third-party iframe script only on-demand when clicked.Resulting Bundle Size Reduction:
2. Accessibility (Lighthouse Score target: 95+)
aria-labeltags to the GitHub remote repository links, theme toggle triggers, mobile navigation menu toggle buttons, and floating page scroll controls.idandhtmlForattributes, and added descriptivearia-labelcontrols for the drag-and-drop file upload fields.<h3>to<h2>on the Privacy page to satisfy sequentially-descending heading rules.<h1>element on theCodeGraphViewerfull-screen page to ensure screen readers always register a main page title.Verification Plan
npm run buildto confirm compiling succeeds and chunk assets are generated properly.Closes #1294