PayU React Interview Questions 2026

Implement a debounce function from scratch in JavaScript. Then explain where you would use debounce vs throttle in a payment checkout flow — for example on a search input, a "Pay Now" button, and a scroll event handler.

Explain the reconciliation algorithm in React. How does React decide which DOM nodes to update when state changes? What is the role of the key prop and what happens when you use an array index as a key versus a stable unique ID?

Build a custom useFetch hook in React that accepts a URL, returns { data, loading, error }, handles component unmount (cleanup), and prevents state updates on an unmounted component. Show the complete implementation.

Implement a reusable PaymentForm component in React with fields for card number, expiry, and CVV. Add real-time validation using controlled components: card number must be 16 digits, expiry must be a future month, CVV 3–4 digits. No external libraries.

You need to implement optimistic UI for a "Add to Cart" button in a React e-commerce app. When the user clicks, the UI should update immediately, but revert if the API call fails. How would you implement this pattern without any state management library?

Design the frontend architecture for a PayU checkout SDK that can be embedded in any merchant website as a script tag. It must render a payment form in an iframe, handle cross-origin communication, support multiple payment methods (card, UPI, netbanking), and work across React, Vue, and plain HTML merchant sites.

You are building a multi-step payment flow: Cart → Address → Payment Method → OTP → Confirmation. Each step has its own data, validation, and API calls. How would you architect state management for this flow in React without Redux? Discuss trade-offs.

Design and implement a recursive category tree component in React for a merchant product catalogue. The tree can be N levels deep, each node can be expanded/collapsed independently, and the selected path must be highlighted. Clicking a leaf node should emit the full path (e.g. "Electronics > Phones > Android"). Optimise to avoid re-rendering siblings when one node is toggled.

A merchant reports that their checkout page built with your SDK scores 38 on Google Lighthouse. Walk through your systematic debugging process: which Core Web Vitals are likely failing, what tools you would use, and give five concrete optimisations specific to a payment checkout flow.

PayU wants to run A/B tests on the checkout button colour and payment method ordering to improve conversion rates. As the frontend engineer, how would you design the experimentation infrastructure: flag evaluation, consistent user bucketing, avoiding layout shift between variants, and measuring the right success metrics?