스킬 next-cache-components-optimizer

📦

next-cache-components-optimizer

Name: next-cache-components-optimizer
Author: vercel

콘텐츠 리비전 r1 안전 ⚙️ 외부 명령어📁 파일 시스템 접근🔑 환경 변수🌐 네트워크 접근

Optimize Next.js Cache Component Navigation

Next.js routes can delay their static shell while dynamic data resolves. This skill builds verified instant-navigation tests and guides Cache Components refactors that preserve behavior.

지원: Claude Codex Code(CC)

🥉 77 브론즈

Maintain this Skill? Claim it 🥉 77 브론즈

내 에이전트로 설치

이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.

에이전트 요청

Review the Skillstore skill "next-cache-components-optimizer" from https://skillstore.io/skills/vercel-next-cache-components-optimizer.md and its manifest at https://skillstore.io/api/skills/vercel-next-cache-components-optimizer/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.

에이전트가 읽기 쉬운 리소스

AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.

Markdown 상세 GET /skills/vercel-next-cache-components-optimizer.md 서명된 manifest GET /api/skills/vercel-next-cache-components-optimizer/manifest 서명된 lockfile GET /api/skills/vercel-next-cache-components-optimizer/lockfile

테스트해 보기

"next-cache-components-optimizer" 사용 중입니다. Optimize the dashboard route for client-side navigation.

예상 결과:

The dashboard shell waited for a top-level session read.
The layout and existing chart skeleton now commit immediately.
The locked navigation test fails without the refactor and passes with it.

"next-cache-components-optimizer" 사용 중입니다. Add regression coverage for the initial product-page load.

예상 결과:

The new initial-load check verifies that the product header is served in the static shell while deferred inventory remains gated.

"next-cache-components-optimizer" 사용 중입니다. Review whether the search route can become fully instant.

예상 결과:

The shared shell can commit instantly, but query-specific results require targeted full prefetching or continued streaming.

보안 감사

안전

v1 • 2026. 8. 20. 버전별 보고서 열기

All 158 static alerts are false positives caused by Markdown formatting, fixed relative paths, non-secret deployment flags, and official documentation links. No prompt injection, secret collection, arbitrary process execution, path traversal, or data-exfiltration intent was found. The skill provides legitimate Next.js optimization guidance and explicitly keeps its testing API out of production.

스캔된 파일

1,356

분석된 줄 수

검토 항목

오탐 무시됨

위험 요인

⚙️ 외부 명령어 (50)

📁 파일 시스템 접근 (4)

reference/real-app-patterns.md:79 reference/red-test-robustness.md:142 test-template.md:13 test-template.md:28

🔑 환경 변수 (14)

rig-template.md:40 rig-template.md:41 rig-template.md:98 rig-template.md:103 rig-template.md:40 rig-template.md:41 rig-template.md:98 rig-template.md:103 SKILL.md:199 SKILL.md:200 SKILL.md:202 SKILL.md:199 SKILL.md:200 SKILL.md:202

🌐 네트워크 접근 (7)

SKILL.md:41 SKILL.md:156 SKILL.md:301 SKILL.md:348 SKILL.md:349 SKILL.md:375 SKILL.md:472

가장 최근에 완료된 정적·의미론적 감사에서 확인된 보안 발견 사항이 감지되지 않았습니다. 이는 스킬에 부작용이 없음을 증명하지 않습니다.

감사자: codex

이 보고서 공유 및 인용

버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.

버전별 보고서 열기

보고서 링크 복사

https://skillstore.io/skills/vercel-next-cache-components-optimizer/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown 배지

[![Skillstore security assessment](https://skillstore.io/badges/skills/vercel-next-cache-components-optimizer/security.svg)](https://skillstore.io/skills/vercel-next-cache-components-optimizer?utm_source=security_passport_badge)

HTML 배지

<a href="https://skillstore.io/skills/vercel-next-cache-components-optimizer?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/vercel-next-cache-components-optimizer/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

임베드 카드

<iframe src="https://skillstore.io/embed/skills/vercel-next-cache-components-optimizer.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

학술 인용 (APA · BibTeX · CFF)

APA 인용

vercel. (2026). next-cache-components-optimizer security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/vercel-next-cache-components-optimizer/audits/1

BibTeX 인용

@techreport{vercel-vercel-next-cache-components-optimizer-2026,
  author = {vercel},
  title = {next-cache-components-optimizer security audit report (audit version 1)},
  institution = {Skillstore},
  year = {2026},
  number = {1},
  url = {https://skillstore.io/skills/vercel-next-cache-components-optimizer/audits/1},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "next-cache-components-optimizer security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
  - name: "vercel"
date-released: "2026-08-20"
url: "https://skillstore.io/skills/vercel-next-cache-components-optimizer/audits/1"
identifiers:
  - type: other
    value: "skillstore:vercel-next-cache-components-optimizer:audit:1"
    description: "Skillstore immutable audit report identifier"

Skillstore 점수

이 점수의 이유 증거 신뢰도: 중간

아키텍처

유지보수성

콘텐츠

커뮤니티

사양 준수

만들 수 있는 것

Fix a blocking route

Identify why a route shell waits for dynamic data, then move blocking work behind focused Suspense boundaries.

Build a reliable test rig

Configure a production-like environment that exposes the testing API only outside production and verifies the deployed revision.

Prevent navigation regressions

Add hard-navigation and soft-navigation checks that prove meaningful shell content commits before deferred data.

이 프롬프트를 사용해 보세요

Check one route

Review the route [ROUTE]. Confirm the Next.js and Cache Components prerequisites, then explain what prevents its static shell from committing instantly.

Create an instant test

Create a Playwright instant-navigation test for [ROUTE] using [NAVIGATION TYPE]. Use an existing static shell marker and verify the test cannot pass vacuously.

Optimize and verify

Optimize [ROUTE] for hard and soft navigation. Reuse existing loading interfaces, preserve behavior, and verify failure without the fix and success with it.

Establish the complete loop

Discover this repository build and test rig, document its safeguards, optimize [ROUTES] individually, and provide linked evidence for baseline, differential, parity, and final tests.

모범 사례

Verify the testing API is enabled for measured builds and disabled for production.
Choose a stable synchronous shell marker that is visible to the actual test account.
Keep a differential result that fails without the fix and passes with it.

피하기

Do not measure instant navigation with development mode, custom timers, or retries.
Do not place one coarse Suspense boundary around the entire route.
Do not ship baseline scaffolding or duplicate existing loading interfaces.

자주 묻는 질문

Which Next.js versions are supported?

The workflow requires Next.js 16.3 or newer with Cache Components enabled.

Can the tests run against next dev?

No. Development mode lacks the production prefetch and locking behavior required for a trustworthy result.

Does the skill support both navigation types?

Yes. It covers initial page loads and client-side Link navigation with separate test-driving methods.

Will it create new loading skeletons?

It first reuses route loading files, colocated skeletons, or existing Suspense fallbacks.

How does it avoid a false passing test?

It establishes an unlocked baseline and can verify that deferred content remains gated while the static shell appears.

Can it optimize every dynamic route completely?

No. Some URL-specific content must stream or use targeted full prefetching with an explicit cost tradeoff.

개발자 세부 정보

작성자

vercel

라이선스

MIT

Skillstore 리비전

버전 안내

작성자가 버전을 선언하지 않았습니다.

리포지토리

https://github.com/vercel/next.js/tree/988a6ab72735d5c61f906d6ea0484930aa496713/skills/next-cache-components-optimizer

참조

bdb71a4bc34515f37772ae85fd5501f9c2ff33b0

유지보수 최신성

2026. 8. 20.

사용량

0 다운로드 · 1 조회

파일 구조

📁 reference/

📄 patterns.md

📄 real-app-patterns.md

📄 red-test-robustness.md

📄 rig-template.md

📄 SKILL.md

Playwright 웹 앱 테스트 만들기

작성자 AutumnsGrove

수동 브라우저 테스트는 느리고, 폼, 기기, 네트워크 상태 전반의 회귀 문제를 놓치는 경우가 많습니다. 이 스킬은 Claude, Codex, Claude Code가 실제 웹 워크플로를 위한 실용적인 Playwright 테스트를 만들 수 있도록 돕습니다.

코딩 및 개발 보기

next-cache-components-optimizer

내 에이전트로 설치

에이전트가 읽기 쉬운 리소스

테스트해 보기

보안 감사

위험 요인

보고서 링크 복사

Markdown 배지

HTML 배지

임베드 카드

APA 인용

BibTeX 인용

CITATION.cff

Skillstore 점수

만들 수 있는 것

Fix a blocking route

Build a reliable test rig

Prevent navigation regressions

이 프롬프트를 사용해 보세요

모범 사례

피하기

자주 묻는 질문

개발자 세부 정보

vercel의 다른 스킬

eve

ai-sdk

turborepo

ai-elements

next-cache-components-adoption

관련 스킬

senior-frontend

nextjs-architecture

nextjs-optimization

vercel-react-best-practices

playwright-testing

webapp-testing