State is Read-Only (স্টেট শুধুমাত্র পাঠযোগ্য)

Redux এর তিনটি মূল নীতি - রিডাক্স (Redux) - Web Development

326

Redux এর একটি গুরুত্বপূর্ণ নীতি হলো স্টেট শুধুমাত্র পাঠযোগ্য (State is Read-Only)। এর মানে হলো, Redux-এ অ্যাপ্লিকেশনের স্টেট সরাসরি পরিবর্তন করা যাবে না। স্টেট পরিবর্তন করার জন্য অবশ্যই নির্দিষ্ট একটি প্রক্রিয়া অনুসরণ করতে হবে, যেটি হলো একশন (Action) ডিসপ্যাচ করা। এক্ষেত্রে, স্টেট পরিবর্তন প্রক্রিয়া সম্পূর্ণভাবে একটি নির্দিষ্ট নিয়মে, একটি নির্দিষ্ট প্রক্রিয়ার মাধ্যমে ঘটে, যা স্টেটকে পূর্বানুমানযোগ্য এবং সহজে ডিবাগযোগ্য করে তোলে।


স্টেট শুধুমাত্র পাঠযোগ্য হওয়ার সুবিধা

  1. অপরিবর্তনীয়তা নিশ্চিত করা: স্টেট সরাসরি পরিবর্তন করা যাবে না, তাই একটি নির্দিষ্ট সময়ের মধ্যে স্টেটের পূর্ববর্তী মান সংরক্ষিত থাকে। এটি অ্যাপ্লিকেশনটির পূর্বানুমানযোগ্যতা বাড়ায় এবং ত্রুটি সনাক্তকরণ সহজ করে।
  2. ডিবাগিং সহজ: যেহেতু স্টেট কখনো সরাসরি পরিবর্তন হয় না, আপনি স্টেটের পরিবর্তনগুলো পর্যবেক্ষণ করতে পারেন। একশন এবং রিডিউসারের মাধ্যমে স্টেট পরিবর্তন হয়, ফলে আপনি সহজেই জানবেন কিভাবে এবং কখন স্টেট পরিবর্তন হয়েছে। এই ধারাবাহিকতা ডিবাগিং এবং টেস্টিংকে আরো কার্যকরী করে।
  3. পূর্বানুমানযোগ্য আচরণ: স্টেটের পরিবর্তন কখনোই সরাসরি হয়ে না, বরং একশন ডিসপ্যাচ করার মাধ্যমে ঘটে। এটি স্টেটের আচরণ পূর্বানুমানযোগ্য করে তোলে, কারণ আপনি জানবেন যে স্টেট কেবলমাত্র নির্দিষ্ট একশন এর মাধ্যমে পরিবর্তিত হবে এবং স্টেটের পরিবর্তন শৃঙ্খলাবদ্ধ।

স্টেট পরিবর্তন কীভাবে ঘটে?

Redux-এ স্টেট পরিবর্তন করার জন্য আপনাকে প্রথমে একটি অ্যাকশন (Action) তৈরি করতে হবে, তারপর সেই অ্যাকশনটি ডিসপ্যাচ (Dispatch) করতে হবে। একবার অ্যাকশন ডিসপ্যাচ হলে, এটি রিডিউসার (Reducer)-এ যাবে, যেখানে রিডিউসার স্টেটের পূর্ববর্তী মানের উপর ভিত্তি করে একটি নতুন স্টেট তৈরি করবে এবং সেই নতুন স্টেট স্টোরে সঞ্চিত হবে।

১. অ্যাকশন (Action)

অ্যাকশন হলো একটি JavaScript অবজেক্ট, যা স্টেটের পরিবর্তন কী হতে হবে তা জানায়। এটি সাধারণত একটি type প্রপার্টি এবং অন্যান্য প্রাসঙ্গিক ডেটা ধারণ করে।

const addTodoAction = {
  type: 'ADD_TODO',
  payload: 'Learn Redux'
};

২. রিডিউসার (Reducer)

রিডিউসার একটি ফাংশন যা স্টেট এবং অ্যাকশন গ্রহণ করে এবং নতুন স্টেট রিটার্ন করে। রিডিউসার কখনোই স্টেট সরাসরি পরিবর্তন করবে না, বরং একটি নতুন স্টেট অবজেক্ট তৈরি করে।

function todosReducer(state = [], action) {
  switch (action.type) {
    case 'ADD_TODO':
      return [...state, action.payload];
    default:
      return state;
  }
}

৩. ডিসপ্যাচ (Dispatch)

ডিসপ্যাচ হল অ্যাকশন স্টোরে পাঠানোর প্রক্রিয়া। একবার অ্যাকশন ডিসপ্যাচ করা হলে, তা রিডিউসার দ্বারা গ্রহণ করা হয় এবং নতুন স্টেট তৈরি হয়ে স্টোরে সঞ্চিত হয়।

store.dispatch(addTodoAction);

স্টেট পরিবর্তন কি খারাপ?

Redux-এ স্টেট সরাসরি পরিবর্তন করা না হওয়ার কারণে এটি অপরিবর্তনীয় স্টেট (Immutable State) ধারণা বজায় রাখে। স্টেটের প্রতিটি পরিবর্তন একটি নতুন কপি তৈরি করে, যা বর্তমান স্টেটের সাথে কোনও পরিবর্তন করতে পারে না। এটি কিছুটা অতিরিক্ত কাজ মনে হতে পারে, তবে এর সুবিধাগুলি অসাধারণ:

  • স্টেটের ইতিহাস রাখা: আগের স্টেট হারিয়ে যাওয়ার বদলে, আপনি তার পরিবর্তনগুলি ট্র্যাক করতে পারেন। ফলে আপনি অ্যাপ্লিকেশনটির স্টেটের ইতিহাস রিভিউ করতে পারবেন এবং ভুল বোঝাবুঝি বা বাগ সনাক্ত করতে পারবেন।
  • বাহ্যিক অবস্থা পরিবর্তন থেকে মুক্ত: যেহেতু স্টেট কখনোই সরাসরি পরিবর্তন হয় না, অ্যাপ্লিকেশনটির আচরণ তৃতীয় পক্ষের কোড বা বাহ্যিক অবস্থা দ্বারা প্রভাবিত হবে না। এতে করে অ্যাপ্লিকেশনটির আচরণ অনেক বেশি পূর্বানুমানযোগ্য হয়।
  • পারফরমেন্স অপ্টিমাইজেশন: Immutable স্টেটের মাধ্যমে আপনি অ্যাপ্লিকেশনে পারফরমেন্স অপ্টিমাইজেশন সহজে করতে পারবেন, কারণ পরিবর্তিত স্টেটগুলোকে দ্রুত তুলনা এবং সনাক্ত করা সম্ভব।

সারাংশ

Redux-এর "স্টেট শুধুমাত্র পাঠযোগ্য" নীতি অ্যাপ্লিকেশনের স্টেট পরিবর্তনকে একটি সুসংগঠিত এবং পূর্বানুমানযোগ্য প্রক্রিয়ায় রূপান্তরিত করে। এতে স্টেট সরাসরি পরিবর্তন হয় না, বরং একশন ডিসপ্যাচ করে রিডিউসার স্টেটের নতুন কপি তৈরি করে। এই প্রক্রিয়া অ্যাপ্লিকেশনটি ডিবাগ এবং টেস্ট করার ক্ষেত্রে আরও কার্যকরী করে, এবং স্টেটের পরিবর্তন ইতিহাস রক্ষা করে ত্রুটি সনাক্তকরণকে সহজ করে তোলে।

Content added By
Promotion

Are you sure to start over?

Loading...