ReactMemo, useHistory, axios.delete()

ReactMemo, useHistory, axios.delete()

//In React, the function used to stop unnecessary re-rendering of child components is React.memo(). This function is a higher-order component that can be applied to functional components to perform memoization. Memoization is a technique to cache the result of a function based on its arguments and return the cached result when the same arguments occur again.

By wrapping a functional component with React.memo(), you can prevent the component from re-rendering when its props remain the same. It optimizes performance by avoiding unnecessary re-renders when the component's inputs have not changed.

import React from 'react';

const ChildComponent = React.memo(({ name }) => {
console.log(Rendering ${name});
return <div>{name}</div>;
});

export default ChildComponent;

/////////////////////////////////////////////////
//in React, useHistory is a hook provided by the react-router-dom library, and it allows you to access the history object. The history object represents the current navigation history of your application, and it enables you to programmatically navigate between different routes in your React application.

With useHistory, you can perform navigations, such as pushing a new entry to the history stack, replacing the current entry, or going back to the previous page in the history.
import React from 'react';
import { useHistory } from 'react-router-dom';

const MyComponent = () => {
const history = useHistory();
const handleButtonClick = () => {
// Push a new route to the history stack
history.push('/new-route');
};

return (
<div>
<h1>Hello, React Router!</h1>
<button onClick={handleButtonClick}>Go to New Route</button>
</div>
);
};

export default MyComponent;

//////////////////////////////////////////////
import axios from 'axios';

const apiUrl = 'https://example.com/api/resource/123';

axios.delete(apiUrl)
.then(response => {
// Handle successful response
console.log('Deleted successfully:', response.data);
})
.catch(error => {
// Handle error
console.error('Error deleting:', error);
});