andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2025-12-07 08:19:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

optimize with useMemo

Browse Source
This commit is contained in:
proddy
2024-10-08 22:49:29 +02:00
parent 10c03a3f6b
commit 87cea5865a
1 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
interface/src/components/layout/Layout.tsx
View File

@@ -1,4 +1,4 @@
import { useEffect, useState } from 'react'; import { useEffect, useMemo, useState } from 'react';
import type { FC } from 'react'; import type { FC } from 'react';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
@@ -24,9 +24,11 @@ const Layout: FC<RequiredChildrenProps> = ({ children }) => {
useEffect(() => setMobileOpen(false), [pathname]); useEffect(() => setMobileOpen(false), [pathname]);
// cache the object to prevent unnecessary re-renders
const obj = useMemo(() => ({ title, setTitle }), [title]);
return ( return (
// TODO wrap title/setTitle in a useMemo() <LayoutContext.Provider value={obj}>
<LayoutContext.Provider value={{ title, setTitle }}>
<LayoutAppBar title={title} onToggleDrawer={handleDrawerToggle} /> <LayoutAppBar title={title} onToggleDrawer={handleDrawerToggle} />
<LayoutDrawer mobileOpen={mobileOpen} onClose={handleDrawerToggle} /> <LayoutDrawer mobileOpen={mobileOpen} onClose={handleDrawerToggle} />
<Box component="main" sx={{ marginLeft: { md: `${DRAWER_WIDTH}px` } }}> <Box component="main" sx={{ marginLeft: { md: `${DRAWER_WIDTH}px` } }}>