> ## Content Index
> Fetch the complete content index at: https://stalin-pereira.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# Kill Global State: Using URL Search Params Instead
- URL: https://stalin-pereira.com/kill-global-state-using-url-search-params-instead/
- Published: 2026-01-15T14:24:00.000Z
- Updated: 2026-10-16T19:08:17.000Z
- Description: Advocating for URL-based state (search params) over global stores
- Author: Stalin Pereira
- Tags: Frontend

**Why Your Users Can't Share Links**

The 'Screenshot Problem' that kills collaboration and conversion.

## The 'Hotel Lobby' Analogy

- **The Scenario** — You spend 20 minutes filtering for a 'Sea View, King Bed, Under $200' room.
- **The Share** — You copy the URL and send it to your partner to check.
- **The Disappointment** — They click the link and land in the Hotel Lobby (Homepage). All filters are lost.

## The Culprit: Hidden State

The browser didn't know about your filters.

- **Invisible Data** — Your app stored choices in memory (Redux/Context), not in the address bar.
- **The Disconnect** — The URL says 'Home', but the screen shows 'Search Results'.

## The Old Way: Memory State

Treating the browser like a dumb window.

- **The Vault** — Developers shove filters, sorting, and pagination into a Global Store.
- **The Fragility** — If the user hits 'Refresh', the memory is wiped clean.
- **The Silo** — That state lives only on *your* machine, right now.

## The New Way: URL as Truth

The URL is the single source of truth for UI state.

- **Visible State** — Move state up to the URL: `?color=blue&size=medium&page=2`.
- **Deserialization** — The UI simply reads the URL to decide what to show.
- **Synchronization** — Changing a filter doesn't update state; it updates the URL.

## Superpower #1: Immortality

Surviving the refresh button.

- **Persistence** — Because state is in the URL, a page refresh changes nothing.
- **Bookmarkable** — Users can bookmark their complex search configuration for later.

## Superpower #2: Time Travel

Fixing the broken 'Back' button.

- **Native Navigation** — Every filter change is a navigation event.
- **The Flow** — User clicks 'Back', the URL changes, the UI updates automatically.
- **No Custom Logic** — Stop writing custom code to handle history stacks.

## Superpower #3: Collaboration

Making your app multiplayer-ready.

- **Deep Linking** — Support sends a link to a user: 'Click here to see the error'.
- **Instant Context** — The user sees exactly what Support sees. No instructions needed.

## Architecture: Unidirectional Flow

How data moves in a URL-first app.

- **1\. User Action** — User clicks 'Filter by Red'.
- **2\. Update URL** — App pushes `?color=red` to the browser history.
- **3\. Component Reacts** — Component listens to URL changes and re-renders with red items.

## Wait, What Goes Where?

Not everything belongs in the URL.

- **URL Params** — Anything that defines *what* is being viewed (Filters, Search, Sort, ID).
- **Global State** — Data that is private or cross-cutting (User Profile, Auth Tokens, Theme).
- **The Rule** — If I copy-paste this link, should the recipient see this?

## Business Wins (ROI)

Why stakeholders should care about URLs.

- **Higher Conversion** — Marketing can link directly to 'Red Sneakers on Sale'.
- **Better SEO** — Search engines can index specific categorized pages.
- **Fewer Bugs** — Less state synchronization code means fewer edge cases.

## The Takeaway

Stop fighting the browser. embrace it.

> The URL is not just an address. It's your application state.

---

Check your current project. Can you refresh the page and keep your place?