Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/kamranayub/pluralsight-course-react-performance

Pluralsight React 18 Performance Playbook course repository
https://github.com/kamranayub/pluralsight-course-react-performance

course performance react reactjs training web web-performance

Last synced: 29 days ago
JSON representation

Pluralsight React 18 Performance Playbook course repository

Awesome Lists containing this project

README

        

# React 18 Performance Playbook Pluralsight Course

This repository is for the Pluralsight course **[React 18 Performance Playbook](https://bit.ly/PSReactPerf)**. The license is Apache 2.0.

## About the Course

> Slow React app with unhappy users? This course will teach you how to quickly audit, diagnose, and solve common performance issues in React applications so you can design them more efficiently and ultimately deliver an optimized real-user experience.

Complex React applications have a lot of moving parts that can grind to a halt, causing a poor user experience. In this course, React Performance Playbook, you’ll learn to audit, diagnose, solve, and prevent React web performance problems.

First, you’ll explore how performance drives business value and how to get buy-in with your team.

Next, you'll learn to design and perform a performance audit to identify issues.

Then, you’ll see how to optimize common component performance problems that reduce unnecessary re-renders.

Finally, you’ll learn how to optimize your app’s loading time and deliver an improved real-user experience.

When you’re finished with this course, you’ll have the skills and knowledge of React performance needed to make your app snappy and your users happy.

## Table of Contents

1. [Assets](#assets)
1. [Demos](#demos)
1. [Share and Discuss](#share-and-discuss)
1. [Notes](#notes)
1. [Errata](#errata)
1. [Updates](#updates)
1. [Additional Resources](#additional-resources)

## Assets

- **Scorecards:** Component design patterns in [Module 5](Module%205), application delivery in [Module 6](Module%206).
- **Cheat Sheets and Templates:** Find them in [Module 3](Module%203)

## Demos

### BBC Simorgh

Throughout the course, the open source BBC web app [simorgh](https://github.com/bbc/simorgh) is used to demonstrate different performance scenarios.

A snapshot of the commit the course was based on is in this repo in the [demo-simorgh](demo-simorgh) folder.

### Next.js Demos

To run the demos locally, you will need Node.js 18+ installed.

Clone the repository then in the `Module 5\demo-counter` folder, run:

npm install
npm start

## Share and Discuss

If you want to discuss scorecards, or ask questions about performance, check out the [Discussions](discussions) for the repo. I get notified whenever there's a new discussion so I can jump in to help if you're stuck as well.

## Errata

*None yet*

Please report course issues using the [Issues](issues) page or the Pluralsight discussion page.

## Updates

- **Feb 2023**
- Initial release 🎉

## Additional Resources

- [Learn React](https://react.dev/learn)
- [Web.dev](https://web.dev)