React বনাম Vue বনাম Angular — একটি তুলনা

# --- স্টাইল ১: React-এর দর্শন -- এক্সপ্লিসিট রিরেন্ডার কল ---
def react_style_counter():
    print("--- React-স্টাইল (এক্সপ্লিসিট রিরেন্ডার) ---")
    state = {"count": 0}

    def render():
        print(f"  render() কল হলো -> count = {state['count']}")

    def set_count(new_value):
        state["count"] = new_value
        render()  # <-- ডেভেলপারকেই স্পষ্টভাবে রিরেন্ডার ট্রিগার করতে হয়

    render()          # প্রাথমিক render
    set_count(1)
    set_count(2)


# --- স্টাইল ২: Vue-এর দর্শন -- স্বয়ংক্রিয় রিঅ্যাক্টিভ ট্র্যাকিং ---
class Observable:
    """একটি মান -- বদলালেই রেজিস্টার-করা 'watcher' স্বয়ংক্রিয়ভাবে কল হয়"""
    def __init__(self, initial_value, watcher):
        self._value = initial_value
        self._watcher = watcher

    @property
    def value(self):
        return self._value

    @value.setter
    def value(self, new_value):
        self._value = new_value
        self._watcher(new_value)  # <-- মান বদলানোর সাথে সাথেই স্বয়ংক্রিয় ট্রিগার


def vue_style_counter():
    print("--- Vue-স্টাইল (স্বয়ংক্রিয় রিঅ্যাক্টিভিটি) ---")

    def render(count):
        print(f"  watcher স্বয়ংক্রিয়ভাবে render করল -> count = {count}")

    count = Observable(0, watcher=render)
    render(count.value)   # প্রাথমিক render
    count.value = 1       # <-- ডেভেলপার শুধু মান বদলাচ্ছে, render() আলাদা করে ডাকছে না
    count.value = 2


# --- স্টাইল ৩: Angular-এর দর্শন -- এক্সপ্লিসিট চেঞ্জ-ডিটেকশন চক্র ---
def angular_style_counter():
    print("--- Angular-স্টাইল (চেঞ্জ-ডিটেকশন চক্র) ---")
    state = {"count": 0}
    last_checked = {"count": None}

    def check_for_changes(cycle_num):
        if state["count"] != last_checked["count"]:
            print(f"  [চক্র {cycle_num}] পরিবর্তন পাওয়া গেল -> count = {state['count']}")
            last_checked["count"] = state["count"]
        else:
            print(f"  [চক্র {cycle_num}] কোনো পরিবর্তন নেই, স্কিপ")

    check_for_changes(1)      # প্রাথমিক চক্র
    state["count"] = 1        # <-- সরাসরি মান বদলানো হলো, কিন্তু এখনো 'দেখা' হয়নি
    check_for_changes(2)      # পরের চক্রেই এটা ধরা পড়ে
    check_for_changes(3)      # কোনো পরিবর্তন নেই -- তাই স্কিপ হবে
    state["count"] = 2
    check_for_changes(4)


react_style_counter()
print()
vue_style_counter()
print()
angular_style_counter()