Hybrid Routing Discovery
How we solve the sandbox URL paradox.
🏛️ Hybrid Content Discovery Strategy
Core Philosophy: In an uncertain runtime environment, locate content through a deterministic "registration dictionary".
1. Background: The Time-Travel Bug
In an SPA, when a link is clicked, the router's Loader executes immediately, but the browser's address bar (window.location) updates with a delay.
If the Loader reads window.location, it gets the previous page's URL. This is why clicking in the Docs section might throw an error saying "Blog page not found".
2. Solution: Trust the Future
We must read the location parameter from the Loader's context. It represents the impending target state.
Logic Flow
mermaidgraph TD A[Loader Starts] --> B{Is it a Sandbox Environment?} B -- No --> C[Match directly using Router Params] B -- Yes --> D[Start Dictionary Scanner] D --> E[Read location from Router Context (Future State)] E --> F[Greedy match longest slug in registry] F --> G[Load corresponding Markdown data]
3. Greedy Matching Algorithm (Greedy Dictionary Matching Protocol)
To prevent path ambiguity (e.g., core vs. core/plan), we use a greedy matching logic:
- Get Dictionary: Extract all slugs from the generated manifest.
- Sort Descending: Sort by slug length in descending order (longest first).
- Prefix/Inclusion Check:
typescript
// Use the location passed by the router, it's the only source of truth const targetPath = location.pathname.toLowerCase(); const matched = allSlugs.sort((a,b) => b.length - a.length) .find(slug => targetPath.includes(slug));
4. Production vs. Development Balance
| Dimension | Production Mode (PROD) | Sandbox Rescue (SANDBOX) |
|---|---|---|
| Trigger | Standard domain / Normal params | Blob protocol / Param resolves to * |
| Data Source | params | context.location |
| Match Efficiency | High (Direct Key lookup) | Medium (String traversal) |
| SEO Friendliness | Very High (Standard) | Low (Preview only) |
| Race Condition Immunity | N/A | Very Strong (Ignores browser async update) |
This strategy is the cornerstone of Instant Ship™'s ability to maintain a "plug-and-play" experience in AI Studio.