Cursor rule

1---
2alwaysApply: false
3---
4 
5## Use SWR for Automatic Deduplication
6 
7SWR enables request deduplication, caching, and revalidation across component instances.
8 
9**Incorrect (no deduplication, each instance fetches):**
10 
11```tsx
12function UserList() {
13  const [users, setUsers] = useState([])
14  useEffect(() => {
15    fetch('/api/users')
16      .then(r => r.json())
17      .then(setUsers)
18  }, [])
19}
20```
21 
22**Correct (multiple instances share one request):**
23 
24```tsx
25import useSWR from 'swr'
26 
27function UserList() {
28  const { data: users } = useSWR('/api/users', fetcher)
29}
30```
31 
32**For immutable data:**
33 
34```tsx
35import { useImmutableSWR } from '@/lib/swr'
36 
37function StaticContent() {
38  const { data } = useImmutableSWR('/api/config', fetcher)
39}
40```
41 
42**For mutations:**
43 
44```tsx
45import { useSWRMutation } from 'swr/mutation'
46 
47function UpdateButton() {
48  const { trigger } = useSWRMutation('/api/user', updateUser)
49  return <button onClick={() => trigger()}>Update</button>
50}
51```
52 
53Reference: [https://swr.vercel.app](https://swr.vercel.app)
54