diff --git a/src/globals.d.ts b/src/globals.d.ts index 47b31c9..28d03a0 100644 --- a/src/globals.d.ts +++ b/src/globals.d.ts @@ -1,24 +1,24 @@ -declare module '*.module.css' { - const classes: { [key: string]: string }; - export default classes; +declare module "*.module.css" { + const classes: {[key: string]: string}; + export default classes; } -declare module '*.module.scss' { - const classes: { [key: string]: string }; - export default classes; +declare module "*.module.scss" { + const classes: {[key: string]: string}; + export default classes; } -declare module '*.module.sass' { - const classes: { [key: string]: string }; - export default classes; +declare module "*.module.sass" { + const classes: {[key: string]: string}; + export default classes; } -declare module '*.module.less' { - const classes: { [key: string]: string }; - export default classes; +declare module "*.module.less" { + const classes: {[key: string]: string}; + export default classes; } -declare module '*.module.styl' { - const classes: { [key: string]: string }; - export default classes; -} \ No newline at end of file +declare module "*.module.styl" { + const classes: {[key: string]: string}; + export default classes; +} diff --git a/src/react-render-perf/lesson-01/index.tsx b/src/react-render-perf/lesson-01/index.tsx index 850031d..24da318 100644 --- a/src/react-render-perf/lesson-01/index.tsx +++ b/src/react-render-perf/lesson-01/index.tsx @@ -8,19 +8,19 @@ import Content from "./content.mdx"; import Exercise from "./exercise/index"; import Solution from "./solution/index"; -export default function Page() { - return ( -
-
- Home -

01 - Memoizing Expensive Components

-
-
- -
-
- -
-
- ); +export default function Page() { + return ( +
+
+ Home +

01 - Memoizing Expensive Components

+
+
+ +
+
+ +
+
+ ); } diff --git a/src/react-render-perf/lesson-02/exercise/gradient.tsx b/src/react-render-perf/lesson-02/exercise/gradient.tsx index 78838f6..0789f5d 100644 --- a/src/react-render-perf/lesson-02/exercise/gradient.tsx +++ b/src/react-render-perf/lesson-02/exercise/gradient.tsx @@ -13,7 +13,9 @@ export function Gradient({start, stop, steps}: Props) { const swatches: Array> = []; for (let i = 0; i < steps; i++) { const color = lerpColor(start, stop, i / steps); - swatches.push(); + swatches.push( + , + ); } return ( diff --git a/src/react-render-perf/lesson-02/exercise/grid.tsx b/src/react-render-perf/lesson-02/exercise/grid.tsx index 137b323..b90a2a4 100644 --- a/src/react-render-perf/lesson-02/exercise/grid.tsx +++ b/src/react-render-perf/lesson-02/exercise/grid.tsx @@ -23,7 +23,9 @@ export function Grid({ const start = lerpColor(topLeft, bottomLeft, i / steps); const stop = lerpColor(topRight, bottomRight, i / steps); const key = `${toCssColor(start)}-${toCssColor(stop)}`; - gradients.push(); + gradients.push( + , + ); } return ( diff --git a/src/react-render-perf/lesson-02/index.tsx b/src/react-render-perf/lesson-02/index.tsx index 9e2dc5f..8c62caf 100644 --- a/src/react-render-perf/lesson-02/index.tsx +++ b/src/react-render-perf/lesson-02/index.tsx @@ -8,19 +8,19 @@ import Content from "./content.mdx"; import Exercise from "./exercise/index"; import Solution from "./solution/index"; -export default function Page() { - return ( -
-
- Home -

02 - Prevent Context From Re-rendering

-
-
- -
-
- -
-
- ); +export default function Page() { + return ( +
+
+ Home +

02 - Prevent Context From Re-rendering

+
+
+ +
+
+ +
+
+ ); } diff --git a/src/react-render-perf/lesson-03/index.tsx b/src/react-render-perf/lesson-03/index.tsx index b439547..8c3d0d9 100644 --- a/src/react-render-perf/lesson-03/index.tsx +++ b/src/react-render-perf/lesson-03/index.tsx @@ -8,19 +8,19 @@ import Content from "./content.mdx"; import Exercise from "./exercise/index"; import Solution from "./solution/index"; -export default function Page() { - return ( -
-
- Home -

03 - Avoid Using Context

-
-
- -
-
- -
-
- ); +export default function Page() { + return ( +
+
+ Home +

03 - Avoid Using Context

+
+
+ +
+
+ +
+
+ ); } diff --git a/src/react-render-perf/lesson-04/index.tsx b/src/react-render-perf/lesson-04/index.tsx index 17388ea..d07e270 100644 --- a/src/react-render-perf/lesson-04/index.tsx +++ b/src/react-render-perf/lesson-04/index.tsx @@ -8,19 +8,19 @@ import Content from "./content.mdx"; import Exercise from "./exercise/index"; import Solution from "./solution/index"; -export default function Page() { - return ( -
-
- Home -

04 - Splitting Up Large Components

-
-
- -
-
- -
-
- ); +export default function Page() { + return ( +
+
+ Home +

04 - Splitting Up Large Components

+
+
+ +
+
+ +
+
+ ); } diff --git a/src/react-render-perf/shared/tabs.tsx b/src/react-render-perf/shared/tabs.tsx index 9b48f4e..a8798af 100644 --- a/src/react-render-perf/shared/tabs.tsx +++ b/src/react-render-perf/shared/tabs.tsx @@ -5,31 +5,37 @@ import * as styles from "../shared/index.module.css"; type Tab = "exercise" | "solution"; type Props = { - tabs: { - exercise: () => React.ReactNode; - solution: () => React.ReactNode; - } + tabs: { + exercise: () => React.ReactNode; + solution: () => React.ReactNode; + }; }; export default function Tabs({tabs}: Props) { - const [tab, setTab] = React.useState("exercise"); + const [tab, setTab] = React.useState("exercise"); - return <> -
- setTab("exercise")} - > - Exercise - - setTab("solution")} - > - Solution - -
- {tab === "exercise" && } - {tab === "solution" && } - ; -} \ No newline at end of file + return ( + <> +
+ setTab("exercise")} + > + Exercise + + setTab("solution")} + > + Solution + +
+ {tab === "exercise" && } + {tab === "solution" && } + + ); +}