Cursor rule

1---
2alwaysApply: false
3---
4 
5## Avoid Duplicate Serialization in RSC Props
6 
7**Impact: LOW (reduces network payload by avoiding duplicate serialization)**
8 
9RSC→client serialization deduplicates by object reference, not value. Same reference = serialized once; new reference = serialized again. Do transformations (`.toSorted()`, `.filter()`, `.map()`) in client, not server.
10 
11**Incorrect (duplicates array):**
12 
13```tsx
14// RSC: sends 6 strings (2 arrays × 3 items)
15<ClientList usernames={usernames} usernamesOrdered={usernames.toSorted()} />
16```
17 
18**Correct (sends 3 strings):**
19 
20```tsx
21// RSC: send once
22<ClientList usernames={usernames} />
23 
24// Client: transform there
25'use client'
26const sorted = useMemo(() => [...usernames].sort(), [usernames])
27```
28 
29**Nested deduplication behavior:**
30 
31Deduplication works recursively. Impact varies by data type:
32 
33- `string[]`, `number[]`, `boolean[]`: **HIGH impact** - array + all primitives fully duplicated
34- `object[]`: **LOW impact** - array duplicated, but nested objects deduplicated by reference
35 
36```tsx
37// string[] - duplicates everything
38usernames={['a','b']} sorted={usernames.toSorted()} // sends 4 strings
39 
40// object[] - duplicates array structure only
41users={[{id:1},{id:2}]} sorted={users.toSorted()} // sends 2 arrays + 2 unique objects (not 4)
42```
43 
44**Operations breaking deduplication (create new references):**
45 
46- Arrays: `.toSorted()`, `.filter()`, `.map()`, `.slice()`, `[...arr]`
47- Objects: `{...obj}`, `Object.assign()`, `structuredClone()`, `JSON.parse(JSON.stringify())`
48 
49**More examples:**
50 
51```tsx
52// ❌ Bad
53<C users={users} active={users.filter(u => u.active)} />
54<C product={product} productName={product.name} />
55 
56// ✅ Good
57<C users={users} />
58<C product={product} />
59// Do filtering/destructuring in client
60```
61 
62**Exception:** Pass derived data when transformation is expensive or client doesn't need original.
63