react-lazy-load-image-component | React Component to lazy load images | Frontend Framework library

Two main observations:

1. There are two very large (3+MB) jpg images that I’d recommend seeing how you can optimize with a graphics program, even a simple one like Preview (MacOS), by reducing the dimensions or other means. These two are the biggest issues in your “Avoid enormous network payloads” report, but you might consider optimizing others as well.
2. Local serving of React (or other static) apps typically gives me significantly worse performance than my usual deployed environment behind a CDN. And so at this point I mainly run Lighthouse against the deployed environment, at least for the Performance report. In particular, an environment that supports HTTP/2, provides caching headers, and is generally built for performance (vs. a local server that’s usually not optimized for this purpose) might be worth considering to get you results that better reflect how things will look in production.

Lighthouse tries to do a good job of pointing out specifics, so once you’re running it against a production-like environment (if you choose to do that), I’d recommend closely reviewing the other sections, clicking through the “Learn more” links wherever things get confusing, and seeing where you can optimize further based on the advice Lighthouse gives.

Hope that helps!

I was importing People component as name while it's exported as default, thanks to @Brian Thompson .. it's fixed.