Skip to content

README.md

Latest commit

 

History

History
34 lines (22 loc) · 1.18 KB

README.md

File metadata and controls

34 lines (22 loc) · 1.18 KB
Raw

React Performance Exercise

This overly simple clothing store app based on next.js consists of two pages:

  • / - A list of products
  • /product/[productId] - View a single product

Getting Up and Running

First, download (don't clone) the repo and run:

cd react-perf-exercise
yarn

To run the app locally:

yarn dev

Exercise Overview

There are numerous performance problems in this app that could be fixed:

  • How can you improve the lighthouse performance score for the product listing page?
  • Changing colors on the product listing page could be faster. You can see a noticeable delay if you apply 6x slowdown to your CPU using chrome developer tools. How can you improve this?
  • Product pages load quite slowly. This is due to an artifical delay in pages/api/product.js meant to simulate a slow API. Assume you can't improve the speed of the API. How can you make the transition from the listing page to the product page feel faster?

Submitting your Solution

  • Upload your solution to a new GitHub repository.
  • We will review your solution over Zoom at the end of the two hours.