আমরা অনেক সময় React-এ . map() দিয়ে লুপ করার সময় একটা কমন ওয়ার্নিং পাই
: “unique key missing”
আমরা অনেকেই একটা unique key দিয়ে কাজ চালাইয়া নেই কিন্তু বুঝি না কেন এটা important.
React-এ প্রতিটা কম্পোনেন্টের একটা “key” থাকা মানে হলো React বুঝে কোন কম্পোনেন্টটা কোথায় আছে। ধরুন আপনি একটা সোশ্যাল মিডিয়া টাইপ প্ল্যাটফর্ম বানাচ্ছেন যেখানে infinite-scroll থাকে, মানে ইউজার স্ক্রল করলেই নতুন নতুন কন্টেন্ট লোড হয়। যদি key ঠিকঠাক সেট করা না হয়, তাহলে React এই নতুন যুক্ত হওয়া কন্টেন্ট গুলো নিয়ে গুলিয়ে ফেলবে, কারণ সে জানে না কোনটা নতুন আর কোনটা পুরাতন। ফলে একাধিক unnecessary re-rendering হতে থাকে, যা সাইটের performance এ বাজে impact ফেলে।
অনেকেই key হিসেবে index ব্যবহার করে, কিন্তু এটা একটি bad practice। মূল কারণ হলো, index সাধারণত mutable বা পরিবর্তনশীল হয়—যদি list-এ নতুন item Add ,Delete বা Restructure করা হয়, তখন index গুলি পরিবর্তিত হতে পারে। এতে করে React সঠিকভাবে কোন component update করবে তা বুঝতে পারে না। বরং প্রতিটি item এর নিজস্ব unique id ব্যবহার করা উচিত, যা React-কে item-এর সঠিক অবস্থান ট্র্যাক করতে সহায়তা করে এবং unnecessary re-rendering এর সমস্যা এড়ায়। এর ফলে UI performance আরও smooth হয় এবং application আরও efficient ভাবে চলে।