Explore Performance Optimization Techniques for React

[webcrumbs-community]

Explore Performance Optimization Techniques for React

[shubhalgupta]

@webcrumbs where are react apps, can you please tell me and also assign me this issue?

[aizhuxue007]

@webcrumbs-community Hello I am interested in this issue as I just did a bit of digging on frontend optimization. Please assign it to me and thank you!

[AJBrownson]

@webcrumbs-community seems nobody has been assigned to this issue
I would like to work on this one

[AJBrownson]

@aizhuxue007 @shubhalgupta
How's it going?

[aizhuxue007]

Hello @AJBrownson! Glad you are interested. I'm not sure how to message you privately.

This is the discord server.

https://discord.gg/yEukrcVm

[shubhalgupta]

@shubhalgupta hello Seems you've been pretty busy this past few days How's it going?

Hello! Yes, I was not well since last week, hence didn't showed up!

[aizhuxue007]

Hello everyone! I want to provide a progress update for this issue. So far, I read like 3 articles specific to frontend and React optimization and took notes.

I think this markdown can be an extensible list of ways to optimize load time and other performance enhancements to a React App. Meaning, @shubhalgupta and @AJBrownson can add more ways to speed up a React App.

I plan to add like 10 ways to improve an React app in this format.

1. A Way to Optimize

• Defining the Problem / Bottleneck
• Solutions

2. A Way to Optimize

• Defining the Problem / Bottleneck
• Solutions

Let me know what you all think! Thanks

[webcrumbs-community]

This is great. Performance is really key as it is something people usually complain about WordPress. Really something for us to always have in mind. Specific performance tips for Module Federation are also welcome. Cheers!

[AJBrownson]

@aizhuxue007 sounds good to me
Write it up so I and @shubhalgupta can add our contributions

[webcrumbs-community]

Guys, brilliant work from @aizhuxue007! https://github.com/webcrumbs-community/webcrumbs/blob/main/research/Performance%20Optimization%20Techniques%20for%20React.md

This is a must read for all React projects, I'd say, not only WebCrumbs.

I don't have anything to add. I'm just highlighting some passages in bold to remember later.

See if this is ok to close or if you'd like to add anything.

Happy weekend!

@AJBrownson @shubhalgupta @vbrazo

[webcrumbs-community]

Ok! I'm closing this one. But let us know anytime if you have something to add. Cheers!

[webcrumbs-community]

Hi, @shubhalgupta! It's more like a theoretical question. What do you think about choosing one issue first and then select another? What's your favorite? Cheers!

[webcrumbs-community]

@aizhuxue007 That's great! What do you think about taking one issue at a time? I'm afraid you'll be overloaded!

[webcrumbs-community]

If you'd like working on this one together, I think this issue can really benefit from multiple perspectives. I'd suggest @AJBrownson take a first look and perhaps @aizhuxue007 and @shubhalgupta could add on later. What do you think?

[aizhuxue007]

@webcrumbs-community Sounds like a plan!

Regarding the two issues.. If you give me 3 weeks, I might be done with both, maybe sooner.. I got 3 other guys helping me as well haha.

[AJBrownson]

@webcrumbs-community okay

[aizhuxue007]

@AJBrownson I'm doing well. Hbu?

So far I created a markdown file and wrote down the steps to complete this issue.

1. Gather resources
2. Read through them
3. First draft
4. Edit
5. Send PR

I have a Discord server with several other open source contributors, it's fairly active. If you would like to join lmk!

[AJBrownson]

@aizhuxue007 okay
Still collating and reading resources on my own end

The discord server stuff sounds like fun
I'm interested

[AJBrownson]

@shubhalgupta hello
Seems you've been pretty busy this past few days
How's it going?

[aizhuxue007]

@AJBrownson @shubhalgupta I just sent my PR for this issue just now.
https://github.com/webcrumbs-community/webcrumbs/pulls

If it merges, please git pull it to your local repo to contribute!
Path to file -> research/Performance Optimization Techniques for React.md

Have a great weekend!

[aizhuxue007]

Just found this article. Very helpful for React optimization

https://www.javacodegeeks.com/2023/11/mastering-performance-optimization-in-react-web-development-a-complete-handbook.html?ref=dailydev