Create a component that uses useMemo to optimize the rendering of a list of items by sorting them only when necessary.
MediumProblem Statement
Create a component that uses useMemo to optimize the rendering of a list of items by sorting them only when necessary.
Sample Input
Initial list: [4, 2, 9, 1]
Sample Output
A sorted list is displayed only when the user clicks the 'Sort' button.
Limits
Time: 2s · Memory: 256 MB
Code Editor
00:00
import React, { useState, useMemo } from "react";
const OptimizedSort = () => {
return (
<div>
<button>Sort</button>
<ul>
{/* Render sorted items */}
</ul>
</div>
);
};
export default OptimizedSort;
Input
Initial list: [4, 2, 9, 1]
Expected Output
A sorted list is displayed only when the user clicks the 'Sort' button.