phdi icon indicating copy to clipboard operation
phdi copied to clipboard

Boban/suspense

Open BobanL opened this issue 1 year ago • 0 comments

PULL REQUEST

General Summary

  • Use "use client" only where necessary, like when we are using browser and interactivity specific functionality. This allows us to default to server side rendering which increase performance.

Explanation of most of the changes.

  • Install jsdom to handle the TableToJson functionality on the server.
  • Install dompurify to clean any potential misconfigured HTML that was passed to us in miscellaneous notes. Since this section is now rendered on the server there are warnings about how invalid HTML is being used and it looked incorrect. image (this is fixed with dompurify, just wanted to show the example with it).
  • Fix build to include static assets
  • Fix start to call the standalone server.js that is generated
  • Utilize error.tsx and loading.tsx that are built in to show error and loading states.
  • Move formatTablesToJson to its own file since it should only be used for server side rendering with the use of jsdom.
  • Move metrics into a new component that returns an empty div. This seemed to be the best place to put
  • Remove api calls to fetch data and instead use server actions

Additional Information

Performance on Main: image Performance now: image

React-uswds shows a warning. This change did not introduce this image

Occasionally, a warning will appear that aria-describedby did not match between the server and the client. image

Checklist

  • [ ] If this code affects the other scrum team, have they been notified? (In Slack, as reviewers, etc.)

BobanL avatar May 22 '24 14:05 BobanL