refactor(29-01): memoize MixersContext provider value

- Add useMemo wrapper around mixerHelper value
- Prevents new object creation on every render
- Depends on stable mixerHelper (from Task 1a)
- Context consumers now only re-render when data actually changes

This eliminates cascading re-renders when unrelated state updates occur.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Nuwan 2026-03-05 17:51:46 +05:30
parent d008fe977c
commit 6b5b0990bb
1 changed files with 5 additions and 2 deletions

View File

@ -1,4 +1,4 @@
import React, { createContext, useContext } from 'react';
import React, { createContext, useContext, useMemo } from 'react';
import useMixerHelper from '../hooks/useMixerHelper.js';
const MixersContext = createContext();
@ -6,8 +6,11 @@ const MixersContext = createContext();
export const MixersProvider = ({ children }) => {
const mixerHelper = useMixerHelper();
// Memoize context value to prevent unnecessary re-renders of consumers
const value = useMemo(() => mixerHelper, [mixerHelper]);
return (
<MixersContext.Provider value={mixerHelper}>
<MixersContext.Provider value={value}>
{children}
</MixersContext.Provider>
);