How To Increase Performance in React Apps

In this video I will go over 4 tips and tricks on how to increase performance in your react applications.
Join our Discord: / discord
🚀 Learn ReactJS By Building 6 Projects: codedamn.com/learn/reactjs-pr...
🐙 GraphQL Course: codedamn.com/learn/graphql-fo...
► Buy Crypto on Coinbase: coinbase-consumer.sjv.io/PedroTech
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Linkedin: / machadop1407
Instagram: / pedro.fmachado_
Github: github.com/machadop1407
Business Email: [e-mail]
Tags:
- ReactJS Tutorial
- ReactJS and MySQL
- NodeJS Tutorial
- API Tutorial
#reactjs #performance

[@vamsisaikrishna2040]

Tutorial on React Dev Tools and how to optimize performance would be great and love to see that.

[@gautamjuyal]

Keep up the good work man. I honestly find your content informative and easy to understand.

[@damm_coder4550]

Your videos are really helpful 😊

[@faizanahmed9304]

Thank you man for these vidoes, please upload more content like this! Your's firebase video was lit 🔥.

[@chesterxp508]

GoodJob! We wait for performance tutorial!!!

[@zidaneorangindonesia9675]

Awesome dude keep up the videos

[@nirajgurung8348]

Tutorial on React Dev Tools would be great.

[@psicotrogato]

Tutorial about React Tools... I wait it.. thanks a lot for your time and explanations. Good look

[@BalaBmyprof]

Thank you

[@mohammadghandour4756]

Hello, thanks for the tips and for your hard work. I personally would appreciate a video about progressively fetching data with react, express, and mysql. Thank you for your efforts !

[@waleedsharif618]

question: what do you think of nextjs? Nextjs is for server-side rendering and i know it but cuz nextjs has many good things such as routing, can i use nextjs for client-side rendering ? Is there any difference if i use react for client-side rendering vs nextjs?

[@Gustavo-bi4hv]

Conteúdo top, mano.

[@lalagisaa]

which theme do u use on ur VS code, please ? looks great

[@PriyankBolia]

Would love a profiler detailed video.

[@amalmurikkoli7629]

Hey Pedro, how good you are in OOPS, data structures and algorithms and how much you need it for the web development

[@soultouchingsongs]

Awesome 👍

[@cecilec9234]

Ooo I would love a tutorial on optimizing with React Dev Tools!

[@eavoutdom190]

I need next.js content!

[@dhirajsurana5471]

Please create a video on react virtualized, will be very helpful.

[@heitormbonfim]

Mano, faz um video falando sobre como é trabalhar em uma empresa grande como a Twitch. Como foi tua experiência, como lidou com os problemas que iam aparecendo, a pressão, etc

[@tatendamuzenda8442]

lets get this guy to a million subscribers

[@AshtonMotana]

Screw css libraries. I like my custom animations. It's super easy to do, and I control it.

[@joaojosesebastiao9972]

Pedro u can make a tutorial about react virtualize?

[@islamis_powerful]

they use graphql as well for fetching lists

[@lirimh5n]

make a video about design pattern such as Atomic pattern

[@zachary.ramsumair]

Legend

[@sadique_x_]

Please make the video on Chrome dev tools

[@islamis_powerful]

if we have scenario in which we have 5-6 or multiple input fields, we'll have to create refs for every field. This is expensive.

[@Mohit-bk4nu]

I dont think building the components that have already been created is dumb at all, specially for beginners because seeing what a component can do and then building it yourself, makes one elevate their logic building which for sure is going to help them in future, when THEY will create stuff that people are going to use. Maybe in large projects that dont have much longer timeline you can use and customize those components but for beginners, yeah you can build your own components and make it reusable.

[@Trazynn]

I still suck at styling html with css through a stled component. Most tutorials only show how to style one class to one div without explaining what happens when you start adding multiple classes. Copying and pasting ordinary css certainly doesn't do the trick. Referring to a stylesheet works but that's no use if the platform requires styled components.

[@TheBswan]

There is no tutorial to get good at CSS. Build and style your own projects, feel the pain of writing bad CSS, look up how to solve your problems. Also valuable is revisiting basics of CSS. Ignore component libraries and tailwind until you feel confident writing vanilla CSS, because you'll be much more effective with those technologies if you have the fundamentals.

[@skrskrskrr5033]

Gj you save 10ms. React is super efficent in rerendering small thing like this so you acomplished nothing and even its recomented not to use refs in this situation in react docs

[@PedroTechnologies]

I mentioned in the last example that all of the the small things I mentioned in the video are not 100% necessary. I explain that my method for increasing performance is finding issues and fixing them. Also, I mentioned that this stuff may seem insignificant for us when our programs are small and are running on good computers with good internet, but its important to consider all users using the app.

[@raht9578]

thanks pedotech

[@thomasweigert731]

First? :)

[@gianvaldiris5110]

First

[@nikbivation]

Second

[@MegaSpiderpunk]

video content is not expressed in a way for video retention.

[@21agdmnm]

pfff stopped watching when heard about useRef. Read the docs..