정적 서버 함수

[!WARNING] 정적 서버 함수는 실험적 기능입니다!

정적 서버 함수란 무엇인가요?

정적 서버 함수는 프리렌더링/정적 생성 사용 시 빌드 시점에 실행되고 정적 애셋으로 캐시되는 서버 함수입니다. createServerFn에 staticFunctionMiddleware 미들웨어를 적용하여 "static" 모드로 설정할 수 있습니다:

import { createServerFn } from '@tanstack/react-start'
import { staticFunctionMiddleware } from '@tanstack/start-static-server-functions'

const myServerFn = createServerFn({ method: 'GET' })
  .middleware([staticFunctionMiddleware])
  .handler(async () => {
    return 'Hello, world!'
  })

staticFunctionMiddleware이 마지막 미들웨어인지 확인하세요!

이 패턴은 다음과 같이 작동합니다:

빌드 시점
- 빌드 시점 프리렌더링 중에 staticFunctionMiddleware이 적용된 서버 함수가 실행됩니다
- 결과는 파생 키(함수 ID + 매개변수/페이로드 해시)를 사용하여 빌드 출력에 정적 JSON 파일로 캐시됩니다
- 프리렌더링/정적 생성 중에 결과가 평소처럼 반환되며 페이지를 프리렌더링하는 데 사용됩니다
런타임
- 처음에는 프리렌더링된 페이지의 HTML이 제공되고 서버 함수 데이터가 HTML에 삽입됩니다
- 클라이언트가 마운트되면 삽입된 서버 함수 데이터가 하이드레이션됩니다
- 이후 클라이언트 측 호출에서는 서버 함수가 정적 JSON 파일에 대한 fetch 호출로 대체됩니다

정적 서버 함수란 무엇인가요?​

정적 서버 함수란 무엇인가요?