Optimize Your Code!  🔥 How I Optimized Drag n Drop Form Inputs

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

Optimize Your Code! In this tutorial, I show how I optimized drag and drop items in a React app that uses react-hook-form and dndkit. While I don't show every possible React optimization, I hope what I do show helps you.

💖 Support me on Patreon ➜   / davegray  

⭐ Become a full-stack web dev with Zero To Mastery Courses:
Complete Next.js Developer: https://bit.ly/CompNextJSDev
Advanced React: https://bit.ly/AdvReactDev
Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr

🚩 Subscribe ➜ https://bit.ly/3nGHmNn

📬 Course Updates ➜ https://courses.davegray.codes/

❓ Questions - Please post them to my Discord ➜   / discord  

☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray

🔗 My Next.js Videos:    • Next.js Tutorials for Beginners  

👇 Follow Me On Social Media:
GitHub: https://github.com/gitdagray
Twitter:   / yesdavidgray  
LinkedIn:   / davidagray  

Optimize Your Code! 🔥 How I Optimized Drag n Drop Form Inputs

(00:00) Intro
(00:31) Drag n Drop Re-renders
(01:52) Optimize Select Inputs
(06:50) Memoization Inside react-hook-form's render callback
(10:31) Wrap-up

📚 Tutorial References:
🔗 useMemo tutorial:    • useMemo Explained | React Hooks useMe...  
🔗 React.memo tutorial:    • What is React.memo - It's not useMemo  
🔗 Drag n Drop dndkit tutorial:    • Drag and Drop in React - the missing ...  

Was this tutorial about optimizing drag n drop form inputs in React helpful? If so, please share. Let me know your thoughts in the comments.

#optimize #code #react