react-coding-challenges VS why-did-you-render

15-) You have completed your studies and want to test yourself with the project. Here are a few examples of projects by difficulty level. react-coding-challenges

I've had a couple of frontend interviews that involve literally z e r o Leet Code questions. Instead they're more practical, live React coding challenges. I'm looking for more resources to practice. Something along the lines of this or the hacker rank react test.

A collection of react challenges (https://github.com/alexgurr/react-coding-challenges)

There is a little exercise I was asked to do recently as part of a skills assessment, and it used the Spotify API. It’s not a bad way to practice: https://github.com/alexgurr/react-coding-challenges/tree/mas...

We used https://github.com/alexgurr/react-coding-challenges for the live coding test and it worked well enough.

React Coding Challenges

Take a look at the new challenge template here and what makes a good challenge.

It sure is! https://github.com/alexgurr/react-coding-challenges#contributing

The challenges

I currently maintain a GitHub repo called react-coding-challenges. It involves a variety of different difficulty challenges people can check out and complete. I also have a separate, private repository for the solutions to these challenges. The solutions are invite-only, meaning I need to invite each person as a collaborator before they get access (see the why here).

Check out why-did-you-render. It may tell you some more information.

It's a combination of many things, but imo one of the worst is all the footguns regarding state and the rerenders they cause

https://emnudge.dev/blog/react-hostage

It's so easy, that we monkey patch react to debug it https://github.com/welldone-software/why-did-you-render

Plus the vdom... Isn't great, the bundle size puts react at an inherit disadvantage, and the community has a knack for over reliance on bloated packages

When we implemented the MVP of the fintech app, we had a quite complicated form. At that time, I was still young and inexperienced. And eventually, we realized that our project was slowing down. We had to spend additional hours figuring out the reason. We had many unnecessary re-renders because we ignored basic rules related to props in React. I wanted to do everything possible to avoid such situations in the future. So, I added to the project linters like this and an additional starting configuration to package.json to run why-did-you-render. In short, this plugin issues a warning if something is re-rendered unnecessarily and suggests how to avoid it. Also, we included running Lighthouse in headless mode. Some people say that premature optimizations are bad, but for me, it's a principle: do it right from the start.

maybe somethin like https://github.com/welldone-software/why-did-you-render

This might help you out a bit.