Skip to content

Commit 63c86bc

Browse files
fezcodefezcode
committed
Updates
1 parent ac85ec3 commit 63c86bc

File tree

9 files changed

+131
-31
lines changed

9 files changed

+131
-31
lines changed

‎asset-manifest.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"files": {
33
"main.css": "/static/css/main.de034aa8.css",
4-
"main.js": "/static/js/main.881e4bdb.js",
4+
"main.js": "/static/js/main.3e7e191b.js",
55
"static/js/8852.cb3bd41d.chunk.js": "/static/js/8852.cb3bd41d.chunk.js",
66
"static/js/2023.73a4c37e.chunk.js": "/static/js/2023.73a4c37e.chunk.js",
77
"static/js/400.c03458b4.chunk.js": "/static/js/400.c03458b4.chunk.js",
@@ -73,7 +73,7 @@
7373
"static/js/3095.a11abef1.chunk.js": "/static/js/3095.a11abef1.chunk.js",
7474
"static/css/4632.f292f0fd.chunk.css": "/static/css/4632.f292f0fd.chunk.css",
7575
"static/js/4632.f94ec8f4.chunk.js": "/static/js/4632.f94ec8f4.chunk.js",
76-
"static/js/510.52b906a6.chunk.js": "/static/js/510.52b906a6.chunk.js",
76+
"static/js/510.b5f7f4b7.chunk.js": "/static/js/510.b5f7f4b7.chunk.js",
7777
"static/js/1470.fd61fa4b.chunk.js": "/static/js/1470.fd61fa4b.chunk.js",
7878
"static/js/1886.cd5e0f21.chunk.js": "/static/js/1886.cd5e0f21.chunk.js",
7979
"static/css/7737.19f4a017.chunk.css": "/static/css/7737.19f4a017.chunk.css",
@@ -147,6 +147,6 @@
147147
},
148148
"entrypoints": [
149149
"static/css/main.de034aa8.css",
150-
"static/js/main.881e4bdb.js"
150+
"static/js/main.3e7e191b.js"
151151
]
152152
}

‎index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!doctype html><html lang="en" class="dark"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><link rel="icon" type="image/svg+xml" href="/favicon.svg"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><link rel="alternate" type="application/rss+xml" title="Fezcodex RSS Feed" href="/rss.xml"/><meta name="description" content="codex by fezcode..."/><meta property="og:type" content="website"/><meta property="og:url" content="https://fezcode.com/"/><meta property="og:title" content="Fezcodex - Personal Blog and Projects"/><meta property="og:description" content="Discover logs, posts, projects, and stories from Fezcode."/><meta property="og:image" content="/images/ogtitle.png"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:url" content="https://fezcode.com/"/><meta name="twitter:title" content="Fezcodex - Personal Blog and Projects"/><meta name="twitter:description" content="Discover logs, posts, projects, and stories from Fezcode."/><meta name="twitter:image" content="/images/ogtitle.png"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Space+Mono:wght@400;700&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Arvo&family=Inter&family=Playfair+Display&display=swap" rel="stylesheet"><title>fezcodex</title><script defer="defer" src="/static/js/main.881e4bdb.js"></script><link href="/static/css/main.de034aa8.css" rel="stylesheet"></head><body class="bg-slate-950"><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
1+
<!doctype html><html lang="en" class="dark"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><link rel="icon" type="image/svg+xml" href="/favicon.svg"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><link rel="alternate" type="application/rss+xml" title="Fezcodex RSS Feed" href="/rss.xml"/><meta name="description" content="codex by fezcode..."/><meta property="og:type" content="website"/><meta property="og:url" content="https://fezcode.com/"/><meta property="og:title" content="Fezcodex - Personal Blog and Projects"/><meta property="og:description" content="Discover logs, posts, projects, and stories from Fezcode."/><meta property="og:image" content="/images/ogtitle.png"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:url" content="https://fezcode.com/"/><meta name="twitter:title" content="Fezcodex - Personal Blog and Projects"/><meta name="twitter:description" content="Discover logs, posts, projects, and stories from Fezcode."/><meta name="twitter:image" content="/images/ogtitle.png"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Space+Mono:wght@400;700&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Arvo&family=Inter&family=Playfair+Display&display=swap" rel="stylesheet"><title>fezcodex</title><script defer="defer" src="/static/js/main.3e7e191b.js"></script><link href="/static/css/main.de034aa8.css" rel="stylesheet"></head><body class="bg-slate-950"><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

‎posts/posts.json‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,16 @@
11
[
2+
{
3+
"slug": "react-hooks-comparison",
4+
"title": "React Hooks Showdown: useMemo vs useCallback vs useState vs useEffect",
5+
"date": "2025-12-15",
6+
"updated": "2025-12-15",
7+
"description": "A comprehensive comparison of React's most commonly used hooks, explaining when and why to use each.",
8+
"tags": ["react", "hooks", "frontend", "javascript", "webdev"],
9+
"category": "gist",
10+
"filename": "react-hooks-comparison.txt",
11+
"authors": ["fezcode"],
12+
"image": "/images/defaults/sina-salehian-HqmTUJD73mM-unsplash.jpg"
13+
},
214
{
315
"slug": "react-magic-markdown-components",
416
"title": "React Magic: Rendering Components from Markdown Links",

‎posts/react-hooks-comparison.txt‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
## 1. useState: The Memory
2+
3+
**What it does:** Allows a functional component to "remember" information between renders.
4+
5+
**When to use:** Whenever you have data that changes over time and needs to trigger a re-render to update the UI (e.g., form inputs, toggle states, counters).
6+
7+
```javascript
8+
const [count, setCount] = useState(0);
9+
10+
// Update state
11+
setCount(count + 1);
12+
```
13+
14+
## 2. useEffect: The Side Effect
15+
16+
**What it does:** Performs side effects in functional components. "Side effects" are things like data fetching, subscriptions, or manually changing the DOM.
17+
18+
**When to use:** When you need to do something *after* the component renders or when a specific value changes.
19+
20+
```javascript
21+
useEffect(() => {
22+
// This runs after every render
23+
document.title = `You clicked ${count} times`;
24+
25+
// Optional cleanup mechanism
26+
return () => {
27+
// Clean up code here
28+
};
29+
}, [count]); // Only re-run if 'count' changes
30+
```
31+
32+
## 3. useMemo: The Calculator
33+
34+
**What it does:** Memoizes (caches) the *result* of a calculation. It only re-calculates the value when one of its dependencies changes.
35+
36+
**When to use:** Optimization. Use it to avoid expensive calculations on every render.
37+
38+
```javascript
39+
const expensiveValue = useMemo(() => {
40+
return computeExpensiveValue(a, b);
41+
}, [a, b]); // Only re-compute if 'a' or 'b' changes
42+
```
43+
44+
*Note: Don't overuse this. Memoization has its own cost.*
45+
46+
## 4. useCallback: The Function Saver
47+
48+
**What it does:** Memoizes a *function definition*. It returns the same function instance between renders unless its dependencies change.
49+
50+
**When to use:** Optimization. Primarily useful when passing callbacks to optimized child components (like those wrapped in `React.memo`) to prevent unnecessary re-renders of the child.
51+
52+
```javascript
53+
const handleClick = useCallback(() => {
54+
doSomething(a, b);
55+
}, [a, b]); // Function identity remains stable unless 'a' or 'b' changes
56+
```
57+
58+
## Summary Table
59+
60+
| Hook | Returns | Purpose | Re-runs when... |
61+
| :--- | :--- | :--- | :--- |
62+
| **useState** | `[state, setter]` | Manage state | Setter is called |
63+
| **useEffect** | `undefined` | Side effects | Dependencies change |
64+
| **useMemo** | Calculated Value | Cache expensive calculation | Dependencies change |
65+
| **useCallback** | Memoized Function | Stable function identity | Dependencies change |
66+
67+
## Key Difference: useMemo vs useCallback
68+
69+
* `useMemo` caches the **result** of a function call.
70+
* `useCallback` caches the **function itself**.
71+
72+
> `useCallback(fn, deps)` is equivalent to `useMemo(() => fn, deps)`.

‎rss.xml‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,24 @@
99
<link>https://fezcode.com</link>
1010
</image>
1111
<generator>RSS for Node</generator>
12-
<lastBuildDate>Mon, 15 Dec 2025 17:02:49 GMT</lastBuildDate>
12+
<lastBuildDate>Mon, 15 Dec 2025 20:34:40 GMT</lastBuildDate>
1313
<atom:link href="https://fezcode.com/rss.xml" rel="self" type="application/rss+xml"/>
14-
<pubDate>Mon, 15 Dec 2025 17:02:49 GMT</pubDate>
14+
<pubDate>Mon, 15 Dec 2025 20:34:40 GMT</pubDate>
1515
<copyright><![CDATA[2025 Ahmed Samil Bulbul]]></copyright>
1616
<language><![CDATA[en]]></language>
1717
<managingEditor><![CDATA[samil.bulbul@gmail.com (Ahmed Samil Bulbul)]]></managingEditor>
1818
<webMaster><![CDATA[samil.bulbul@gmail.com (Ahmed Samil Bulbul)]]></webMaster>
1919
<ttl>60</ttl>
20+
<item>
21+
<title><![CDATA[React Hooks Showdown: useMemo vs useCallback vs useState vs useEffect]]></title>
22+
<description><![CDATA[[object Object]]]></description>
23+
<link>https://fezcode.com/#/blog/react-hooks-comparison</link>
24+
<guid isPermaLink="false">https://fezcode.com/#/blog/react-hooks-comparison</guid>
25+
<dc:creator><![CDATA[Ahmed Samil Bulbul]]></dc:creator>
26+
<pubDate>Mon, 15 Dec 2025 00:00:00 GMT</pubDate>
27+
<content:encoded><![CDATA[<h2>1. useState: The Memory</h2>
28+
<p><a href="https://fezcode.com/#/blog/react-hooks-comparison">Read more...</a></p>]]></content:encoded>
29+
</item>
2030
<item>
2131
<title><![CDATA[React Magic: Rendering Components from Markdown Links]]></title>
2232
<description><![CDATA[[object Object]]]></description>

‎sitemap.xml‎

Lines changed: 28 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -2,58 +2,64 @@
22
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
33
<url>
44
<loc>https://fezcode.com/</loc>
5-
<lastmod>2025-12-15T17:02:49.739Z</lastmod>
5+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
66
<changefreq>monthly</changefreq>
77
<priority>1.0</priority>
88
</url>
99
<url>
1010
<loc>https://fezcode.com/about</loc>
11-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
11+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
1212
<changefreq>monthly</changefreq>
1313
<priority>0.8</priority>
1414
</url>
1515
<url>
1616
<loc>https://fezcode.com/blog</loc>
17-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
17+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
1818
<changefreq>monthly</changefreq>
1919
<priority>0.8</priority>
2020
</url>
2121
<url>
2222
<loc>https://fezcode.com/projects</loc>
23-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
23+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
2424
<changefreq>monthly</changefreq>
2525
<priority>0.8</priority>
2626
</url>
2727
<url>
2828
<loc>https://fezcode.com/logs</loc>
29-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
29+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
3030
<changefreq>monthly</changefreq>
3131
<priority>0.8</priority>
3232
</url>
3333
<url>
3434
<loc>https://fezcode.com/stories</loc>
35-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
35+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
3636
<changefreq>monthly</changefreq>
3737
<priority>0.8</priority>
3838
</url>
3939
<url>
4040
<loc>https://fezcode.com/settings</loc>
41-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
41+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
4242
<changefreq>monthly</changefreq>
4343
<priority>0.8</priority>
4444
</url>
4545
<url>
4646
<loc>https://fezcode.com/apps</loc>
47-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
47+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
4848
<changefreq>monthly</changefreq>
4949
<priority>0.8</priority>
5050
</url>
5151
<url>
5252
<loc>https://fezcode.com/stories/lore</loc>
53-
<lastmod>2025-12-15T17:02:49.740Z</lastmod>
53+
<lastmod>2025-12-15T20:34:40.711Z</lastmod>
5454
<changefreq>monthly</changefreq>
5555
<priority>0.8</priority>
5656
</url>
57+
<url>
58+
<loc>https://fezcode.com/#/blog/react-hooks-comparison</loc>
59+
<lastmod>2025-12-15T00:00:00.000Z</lastmod>
60+
<changefreq>weekly</changefreq>
61+
<priority>0.7</priority>
62+
</url>
5763
<url>
5864
<loc>https://fezcode.com/#/blog/react-magic-markdown-components</loc>
5965
<lastmod>2025-12-12T00:00:00.000Z</lastmod>
@@ -980,79 +986,79 @@
980986
</url>
981987
<url>
982988
<loc>https://fezcode.com/#/stories/books/1</loc>
983-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
989+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
984990
<changefreq>monthly</changefreq>
985991
<priority>0.6</priority>
986992
</url>
987993
<url>
988994
<loc>https://fezcode.com/#/stories/books/1/pages/1</loc>
989-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
995+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
990996
<changefreq>weekly</changefreq>
991997
<priority>0.5</priority>
992998
</url>
993999
<url>
9941000
<loc>https://fezcode.com/#/stories/books/2</loc>
995-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1001+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
9961002
<changefreq>monthly</changefreq>
9971003
<priority>0.6</priority>
9981004
</url>
9991005
<url>
10001006
<loc>https://fezcode.com/#/stories/books/2/pages/1</loc>
1001-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1007+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10021008
<changefreq>weekly</changefreq>
10031009
<priority>0.5</priority>
10041010
</url>
10051011
<url>
10061012
<loc>https://fezcode.com/#/stories/books/3</loc>
1007-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1013+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10081014
<changefreq>monthly</changefreq>
10091015
<priority>0.6</priority>
10101016
</url>
10111017
<url>
10121018
<loc>https://fezcode.com/#/stories/books/3/pages/1</loc>
1013-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1019+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10141020
<changefreq>weekly</changefreq>
10151021
<priority>0.5</priority>
10161022
</url>
10171023
<url>
10181024
<loc>https://fezcode.com/#/stories/books/3/pages/2</loc>
1019-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1025+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10201026
<changefreq>weekly</changefreq>
10211027
<priority>0.5</priority>
10221028
</url>
10231029
<url>
10241030
<loc>https://fezcode.com/#/stories/books/4</loc>
1025-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1031+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10261032
<changefreq>monthly</changefreq>
10271033
<priority>0.6</priority>
10281034
</url>
10291035
<url>
10301036
<loc>https://fezcode.com/#/stories/books/4/pages/1</loc>
1031-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1037+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10321038
<changefreq>weekly</changefreq>
10331039
<priority>0.5</priority>
10341040
</url>
10351041
<url>
10361042
<loc>https://fezcode.com/#/stories/books/4/pages/2</loc>
1037-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1043+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10381044
<changefreq>weekly</changefreq>
10391045
<priority>0.5</priority>
10401046
</url>
10411047
<url>
10421048
<loc>https://fezcode.com/#/stories/books/5</loc>
1043-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1049+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10441050
<changefreq>monthly</changefreq>
10451051
<priority>0.6</priority>
10461052
</url>
10471053
<url>
10481054
<loc>https://fezcode.com/#/stories/books/5/pages/1</loc>
1049-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1055+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10501056
<changefreq>weekly</changefreq>
10511057
<priority>0.5</priority>
10521058
</url>
10531059
<url>
10541060
<loc>https://fezcode.com/#/stories/books/5/pages/2</loc>
1055-
<lastmod>2025-12-15T17:02:49.748Z</lastmod>
1061+
<lastmod>2025-12-15T20:34:40.718Z</lastmod>
10561062
<changefreq>weekly</changefreq>
10571063
<priority>0.5</priority>
10581064
</url>

static/js/510.52b906a6.chunk.js renamed to static/js/510.b5f7f4b7.chunk.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

static/js/main.881e4bdb.js renamed to static/js/main.3e7e191b.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

static/js/main.881e4bdb.js.LICENSE.txt renamed to static/js/main.3e7e191b.js.LICENSE.txt

File renamed without changes.

0 commit comments

Comments
 (0)