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

perf(web): performance tweaks #972

Draft
wants to merge 6 commits into
base: master
Choose a base branch
from
Draft

Conversation

ivan-aksamentov
Copy link
Member

@ivan-aksamentov ivan-aksamentov commented Aug 28, 2022

This:

  • reduces size and lazy loads GitHub avatars
  • disables showing changelog of new versions (the changelog itself is huge now and increases load time for little advantage)
  • partially reenables static prerendering of the main page
  • splits /results page code away from main bundle. The /tree page was separate already
  • splits away code of modal dialogs
  • converts some of the inline SVG icons into img tags

I ran some Lighthouse benchmarks (https://web.dev/measure/). Not amazing, but a little better than before:

Before:
01

After:
02

@vercel
Copy link

vercel bot commented Aug 28, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
nextclade ✅ Ready (Inspect) Visit Preview Aug 28, 2022 at 5:42PM (UTC)

@ivan-aksamentov ivan-aksamentov changed the title perf: lazy load, reduce size of portrait images perf: enable prerendering of main page Aug 28, 2022
@ivan-aksamentov ivan-aksamentov changed the title perf: enable prerendering of main page perf(web): performance tweaks Aug 28, 2022
@ivan-aksamentov ivan-aksamentov marked this pull request as ready for review August 28, 2022 18:04
return null
}
return <CitationDialog isOpen={showCitation} toggle={totggle} />
}, [showCitation, totggle])
Copy link
Member

@corneliusroemer corneliusroemer Aug 28, 2022

Choose a reason for hiding this comment

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

totggle is a typo of toggle I think :)


const SpinnerWrapper = styled.div<HTMLProps<HTMLDivElement>>`
width: 100%;
height: 100%;
Copy link
Member

Choose a reason for hiding this comment

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

Maybe we need to set this height to 822px?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
No open projects
Development

Successfully merging this pull request may close these issues.

2 participants