start-core/execution-model

Name: start-core/execution-model
Availability: InStock
Author: TanStack

Enforce server and client code boundaries with isomorphic execution APIs.

14.9k|1.8k|Updated Jan 14, 2019

Search Tags:#environment-variables #server-client #start #isomorphic #execution-model

Ready to run

npx skills add https://github.com/TanStack/router --skill start-core-execution-model

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: start-core/execution-model
Source: https://github.com/TanStack/router/tree/main/packages/start-client-core/skills/start-core/execution-model
Command: npx skills add https://github.com/TanStack/router --skill start-core-execution-model

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Isomorphic-by-default development means code runs in both server and client bundles by default. This skill clarifies how to separate server-only logic from client-safe operations to prevent data leaks and runtime errors.

Core Features & Use Cases

Server-bound APIs: creating server functions that run only on the server, with client calls triggering network requests.
Client/Server boundaries: isomorphic functions that switch behavior based on environment, plus ClientOnly components and hydration guards.
Environment safety: guidance on VITE_ prefix exposure and safe access to process.env via server boundaries.

Quick Start

Use the execution model to clearly delineate code that runs on the server from code that runs on the client during SSR and client navigation.

Frequently Asked Questions about start-core/execution-model

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I prevent environment variables from leaking to the client during SSR?▼

To prevent environment variable leaks during SSR, access process.env and secret values exclusively through server functions rather than client bundles. Keep runtime variables safe by using server-bound calls and avoid exposing VITE_ prefixed vars to the client.

How do I enforce server and client boundaries for isomorphic functions?▼

Enforce server and client boundaries by applying creation APIs like createServerFn, createServerOnlyFn, createClientOnlyFn, and createIsomorphicFn to separate server-only logic from client-safe operations during SSR and hydration.

When do I need to use ClientOnly components and hydration guards?▼

You need ClientOnly components and hydration guards like useHydrated when implementing isomorphic logic that should only execute or render after client hydration, preventing runtime errors and mismatched server-client markup.

What is the best way to handle process.env in an isomorphic application?▼

The best way to handle process.env in an isomorphic application is to route secret access through server functions, ensuring the client never receives sensitive data while maintaining safe access to runtime vars via server-bound calls.

Does isomorphic-by-default development cause data leaks in server-side rendering?▼

Isomorphic-by-default development can cause data leaks in server-side rendering if server-only logic is not separated from client-safe operations, making it crucial to apply execution model boundaries to protect secret values.