Skip to content

Commit 9ee5112

Browse files
committed
fix: optimize Medium redirect to eliminate UI flash and improve speed
- Move MediumRedirect route outside Layout wrapper to prevent navigation/footer flash - Eliminate useEffect delay by performing redirect during render phase - Redirect now happens instantly without showing portfolio UI
1 parent 134b9b6 commit 9ee5112

2 files changed

Lines changed: 21 additions & 17 deletions

File tree

src/App.tsx

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,19 @@ function App() {
1313
return (
1414
<ThemeProvider defaultTheme="dark" storageKey="portfolio-theme">
1515
<Router>
16-
<Layout>
17-
<Routes>
18-
<Route path="/" element={<Home />} />
19-
<Route path="/about" element={<About />} />
20-
<Route path="/reading" element={<Reading />} />
21-
<Route path="/writing" element={<Writing />} />
22-
<Route path="/medium/*" element={<MediumRedirect />} />
23-
</Routes>
24-
</Layout>
16+
<Routes>
17+
<Route path="/medium/*" element={<MediumRedirect />} />
18+
<Route path="/*" element={
19+
<Layout>
20+
<Routes>
21+
<Route path="/" element={<Home />} />
22+
<Route path="/about" element={<About />} />
23+
<Route path="/reading" element={<Reading />} />
24+
<Route path="/writing" element={<Writing />} />
25+
</Routes>
26+
</Layout>
27+
} />
28+
</Routes>
2529
<Toaster />
2630
</Router>
2731
</ThemeProvider>

src/pages/MediumRedirect.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
import { useLocation } from "react-router-dom";
2-
import { useEffect } from "react";
32

43
const MediumRedirect = () => {
54
const { pathname, search } = useLocation();
65

7-
useEffect(() => {
8-
let path = pathname.replace(/^\/+/, "").replace(/^medium\/?/, "");
9-
path = path.replace(/^https?:\/\/kapillamba4\.medium\.com\/?/i, "");
10-
const target = `https://kapillamba4.medium.com/${path}${search || ""}`;
11-
window.location.replace(target);
12-
}, [pathname, search]);
6+
// Perform redirect immediately during render - no useEffect delay
7+
let path = pathname.replace(/^\/+/, "").replace(/^medium\/?/, "");
8+
path = path.replace(/^https?:\/\/kapillamba4\.medium\.com\/?/i, "");
9+
const target = `https://kapillamba4.medium.com/${path}${search || ""}`;
10+
11+
// Redirect immediately
12+
window.location.replace(target);
1313

14+
// This return will likely never render due to immediate redirect
1415
return null;
15-
1616
};
1717

1818
export default MediumRedirect;

0 commit comments

Comments
 (0)