codeforboston / codeforboston/maple

Investigate Speeding Up Initial Page Load for Bill Details Page

Open
#1,730 1 comment 0 reactions 1 assignee Claimed by @seatuna View on GitHub
enhancement frontend Individual Bill Page tech debt
Dominant language
TypeScript
Stars
56
Forks
175
Avg merge
2d 5h
Merged PRs (30d)
13

Description

## Problem

When first clicking on a link in the Browse Bills search to load a Bill Details page, it can take an inordinately long time to load (> 5 seconds) to load and shows no UX feedback to the user between their click on a bill and the page transition. Note that this seems to be an issue with cold starts due to low traffic - after a user has visited a bill details page once, going to other bill details for all users is faster for a while.

This is a really bad user experience when it happens- it leads users to think the page isn't responding due to the lack of feedback and slow response. To that end, we should invest some energy in speeding up both the actual first page load of the bill details page when coming from a period of no traffic (the cold start) and the UX feedback (so users at least understand that the site isn't broken and we are actually loading the page)

This is a key part of the site experience - if we find we need to invest a bit in infra spending to keep the response times consistent here (e.g. to keep functions warm), that's perfectly acceptable.

## Success Criteria
- [ ] Investigate and determine our options for speeding up the initial page load time for the Bill Details page (or at least the impression thereof). Some ideas include:
- [ ] Adjusting Vercel cold starts
- [ ] We may have to get Vercel access from Alex to explore options here (IIRC he is currently the only one with access because a team subscription is like $20/month - it may be time to bite the bullet on that)
- [ ] Set up Next.js prefetching for Bill search results (not a universal solution, but could at least improve the Browse -> Details transition that is the main problem)
- [ ] Adding Loading state / Suspense boundaries for Browse -> Details transition
- [ ] Doesn't actually speed up the load of the content, but at least better establishes user expectations and speeds up first contentful paint of the Details page.

This is a bit of a brain dump ATM - making an issue for this to keep track. Might be a good discussion topic for hack night.

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.