Fähigkeiten vercel-react-best-practices
📦

vercel-react-best-practices

v1.0.0 Inhaltsrevision r1 Mittleres Risiko ⚡ Enthält Skripte⚙️ Externe Befehle🌐 Netzwerkzugriff

React と Next.js のパフォーマンスを最適化する

React と Next.js のチームには、コーディングとレビューの際に一貫したパフォーマンス指針が必要です。このスキルは、データフェッチング、バンドル、レンダリング、再レンダリングに関する Vercel スタイルのルールを適用します。

Unterstützt: Claude Codex Code(CC)
📊 72 Angemessen

Mit meinem Agent installieren

Kopieren Sie diese Anfrage in Ihren Agent. Sie enthält die maßgebliche Skill-Seite und das Manifest.

Agent-Anfrage
Review the Skillstore skill "vercel-react-best-practices" from https://skillstore.io/skills/zhanlincui-vercel-react-best-practices.md and its manifest at https://skillstore.io/api/skills/zhanlincui-vercel-react-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Ihr Agent sollte weiterhin seinen Plan anzeigen und alle von der Sicherheitsrichtlinie verlangten Bestätigungen anfordern.

Agent-lesbare Ressourcen

Verwenden Sie diese Links, wenn ein KI-Agent, Crawler oder Skript sauberen Kontext benötigt, statt die vollständige Seite zu lesen.

Markdown-Detailseite GET /skills/zhanlincui-vercel-react-best-practices.md Signiertes manifest GET /api/skills/zhanlincui-vercel-react-best-practices/manifest Signiertes lockfile GET /api/skills/zhanlincui-vercel-react-best-practices/lockfile

Testen

„vercel-react-best-practices“ wird verwendet. 逐次的なデータフェッチングと広範なアイコンインポートを含むダッシュボードページをレビューする。

Erwartetes Ergebnis:

  • レビューでは、同時に開始できる独立したリクエストを特定します。
  • 直接的なアイコンインポート、または設定済みのパッケージインポート最適化を推奨します。
  • 最初のレイアウトに影響しないパネルには Suspense 境界を提案します。

„vercel-react-best-practices“ wird verwendet. 検索コンポーネントが頻繁にレンダリングされすぎる理由を説明する。

Erwartetes Ergebnis:

分析では、広すぎる state 購読、不安定なコールバック、effect の依存関係を追跡し、そのうえでより狭い読み取りと関数型 state 更新を推奨します。

„vercel-react-best-practices“ wird verwendet. Next.js 機能リリース向けのパフォーマンスチェックリストを作成する。

Erwartetes Ergebnis:

  • サーバー処理は可能な限り早く開始し、逐次的な await を避けます。
  • クライアントコンポーネントには、レンダリングに使うフィールドだけを渡します。
  • 重いエディタ、分析、任意のツールは初期パスの外でロードします。

Sicherheitsaudit

Mittleres Risiko
v4 • 8.7.2026 Versionsbericht öffnen

All 172 static findings were adjudicated as false positives from Markdown documentation, code examples, inline backticks, or public reference links. No prompt injection, credential handling, command execution, or unauthorized network intent was found. One medium content-trust issue remains because a community source uses official Vercel attribution that should be clarified before publication.

53
Gescannte Dateien
5,215
Analysierte Zeilen
0
Prüfelemente
0
Falschmeldungen ignoriert

Bestätigte Sicherheitsbedenken (1)

Mittel
SKILL.md:3-12AGENTS.md:3-10metadata.json:3
Unverified Official Affiliation Claim
The community-sourced skill presents itself with official Vercel attribution, including Vercel Engineering, author vercel, and maintained by Vercel language. This can mislead users about provenance and review authority.
The report source type is community, but multiple files state or imply official Vercel ownership. This is a provenance and marketplace trust issue rather than executable malware.

Risikofaktoren

⚡ Enthält Skripte (12)
AGENTS.md:428 AGENTS.md:470 AGENTS.md:508 AGENTS.md:529 AGENTS.md:551 AGENTS.md:2309 rules/bundle-conditional.md:20 rules/bundle-defer-third-party.md:35 rules/bundle-dynamic-imports.md:28 rules/bundle-preload.md:18 rules/bundle-preload.md:40 rules/js-tosorted-immutable.md:57
⚙️ Externe Befehle (79)
AGENTS.md:1056-1064 AGENTS.md:1064-1082 AGENTS.md:1636-1642 AGENTS.md:1758-1760 AGENTS.md:2125-2129 AGENTS.md:2138-2144 README.md:88-89 README.md:89 README.md:96-97 README.md:97-98 README.md:98-99 README.md:99-100 README.md:100-101 README.md:101-105 README.md:105-106 README.md:106-107 README.md:107-108 README.md:108-115 README.md:115-118 rules/client-localstorage-schema.md:27-35 rules/client-localstorage-schema.md:35-53 rules/js-hoist-regexp.md:16-20 rules/js-hoist-regexp.md:29-35 rules/rendering-hydration-no-flicker.md:72-78 SKILL.md:27 SKILL.md:28 SKILL.md:29 SKILL.md:30 SKILL.md:31 SKILL.md:32 SKILL.md:33 SKILL.md:34 SKILL.md:40 SKILL.md:41 SKILL.md:42 SKILL.md:43 SKILL.md:44 SKILL.md:48 SKILL.md:49 SKILL.md:50 SKILL.md:51 SKILL.md:52 SKILL.md:56 SKILL.md:57 SKILL.md:58 SKILL.md:59 SKILL.md:60 SKILL.md:64 SKILL.md:65 SKILL.md:69 SKILL.md:70 SKILL.md:71 SKILL.md:72 SKILL.md:73 SKILL.md:74 SKILL.md:75 SKILL.md:79 SKILL.md:80 SKILL.md:81 SKILL.md:82 SKILL.md:83 SKILL.md:84 SKILL.md:85 SKILL.md:89 SKILL.md:90 SKILL.md:91 SKILL.md:92 SKILL.md:93 SKILL.md:94 SKILL.md:95 SKILL.md:96 SKILL.md:97 SKILL.md:98 SKILL.md:99 SKILL.md:100 SKILL.md:104 SKILL.md:105 SKILL.md:111-115 SKILL.md:115-125
🌐 Netzwerkzugriff (15)
AGENTS.md:995 AGENTS.md:612 AGENTS.md:867 metadata.json:7 metadata.json:8 metadata.json:9 metadata.json:10 metadata.json:11 metadata.json:12 metadata.json:13 README.md:84 README.md:123 rules/_sections.md:26 rules/client-swr-dedup.md:18 rules/server-serialization.md:10
Geprüft von: codex Audit-Verlauf anzeigen →
Diesen Bericht teilen & zitieren

Teile den versionierten Bewertungsbericht, das neutrale Badge, die Einbettungskarte und Zitate. Skillstore berichtet Nachweise, ohne zu entscheiden, ob dieser Skill sicher ist.

Versionsbericht öffnen
Sicherheitsbewertung

Berichtslink kopieren

https://skillstore.io/skills/zhanlincui-vercel-react-best-practices/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown-Badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/zhanlincui-vercel-react-best-practices/security.svg)](https://skillstore.io/skills/zhanlincui-vercel-react-best-practices?utm_source=security_passport_badge)

HTML-Badge

<a href="https://skillstore.io/skills/zhanlincui-vercel-react-best-practices?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/zhanlincui-vercel-react-best-practices/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Einbettungskarte

<iframe src="https://skillstore.io/embed/skills/zhanlincui-vercel-react-best-practices.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
Wissenschaftliche Zitate (APA · BibTeX · CFF)

APA-Zitat

ZhanlinCui. (2026). vercel-react-best-practices security audit report (audit version 4) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/zhanlincui-vercel-react-best-practices/audits/4

BibTeX-Zitat

@techreport{zhanlincui-zhanlincui-vercel-react-best-practices-2026, author = {ZhanlinCui}, title = {vercel-react-best-practices security audit report (audit version 4)}, institution = {Skillstore}, year = {2026}, number = {4}, url = {https://skillstore.io/skills/zhanlincui-vercel-react-best-practices/audits/4}, note = {Author version 1.0.0} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "vercel-react-best-practices security audit report (audit version 4)" version: "1.0.0" type: report authors: - name: "ZhanlinCui" date-released: "2026-07-08" url: "https://skillstore.io/skills/zhanlincui-vercel-react-best-practices/audits/4" identifiers: - type: other value: "skillstore:zhanlincui-vercel-react-best-practices:audit:4" description: "Skillstore immutable audit report identifier"

Varianten vergleichen

4 installierbare Varianten

Jeder Autor bleibt ein eigener installierbarer Skill. Die empfohlene Variante wird nach Skillstore-Nachweisen bewertet.

Warum diese Variante zuerst steht

Höchster Skillstore-Score
vercel-labs Empfohlen

vercel-labs-vercel-react-best-practices

Skillstore-Score 80
Evidenzvertrauen Hoch
Skillstore-Nutzung 33
Aktualisiert

2026-09-09

am-will

am-will-vercel-react-best-practices

Skillstore-Score 79
Evidenzvertrauen Hoch
Skillstore-Nutzung 27
Aktualisiert

2026-09-09

sickn33

sickn33-vercel-react-best-practices

Skillstore-Score 78
Evidenzvertrauen Hoch
Skillstore-Nutzung 10
Aktualisiert

2026-09-09

ZhanlinCui Aktuell

zhanlincui-vercel-react-best-practices

Skillstore-Score 72
Evidenzvertrauen Hoch
Skillstore-Nutzung 104
Aktualisiert

2026-09-09

Skillstore-Score

Warum dieser Score Evidenzvertrauen: Hoch
55
Architektur
100
Wartbarkeit
87
Inhalt
71
Gemeinschaft
83
Spezifikationskonformität

Was Sie erstellen können

Pull Request をレビューする

コードがマージされる前に、データウォーターフォール、大きなインポート、広すぎるクライアント props、回避可能な再レンダリングを見つけます。

Next.js ページをリファクタリングする

逐次的なサーバー処理を、並列フェッチング、Suspense 境界、より小さなクライアントペイロードへ変換します。

チームのパフォーマンス標準を作成する

Vercel スタイルのルールを、レビュー、移行、機能計画で繰り返し使える指針にします。

Diese Prompts ausprobieren

すぐに改善できる点を見つける 
vercel-react-best-practices skill を使って、この React または Next.js コードをレビューしてください。async ウォーターフォール、バンドルサイズ、不要な再レンダリングに注目してください。各推奨事項を平易な言葉で説明してください。
ページをリファクタリングする 
このスキルを使って、この Next.js ページをリファクタリングしてください。データフェッチングの並列性、Suspense 境界、RSC シリアライズを改善しながら、挙動は維持してください。行ったトレードオフを列挙してください。
バンドル改善を計画する 
このスキルを使って、この機能のバンドルサイズを監査してください。barrel imports、重いクライアントコンポーネント、サードパーティライブラリ、プリロードの機会を特定してください。ユーザーへの影響に基づいて修正の優先順位を付けてください。
アーキテクチャレビューを実行する 
このスキルを使って、このワークフローをエンドツーエンドで分析してください。サーバーデータフロー、クライアントフェッチング、ストレージ利用、イベントリスナー、レンダリングコスト、JavaScript のホットパスを扱ってください。優先順位付きの改善計画を返してください。

Bewährte Praktiken

  • 独立したデータ処理は早期に開始し、結果が必要になった時点でのみ await します。
  • クライアント境界は小さく保ち、クライアントコンポーネントが使うフィールドだけを渡します。
  • 例はパターンとして扱い、重要な変更は対象アプリケーションで測定します。

Vermeiden

  • ページ、actions、route handlers の中で、無関係なサーバー処理を順番に await すること。
  • 広範な barrel エントリーポイントを通じて、アイコンライブラリやコンポーネントライブラリ全体をインポートすること。
  • まず state の読み取りと effect の依存関係を狭める前に、あらゆるものをメモ化すること。

Häufig gestellte Fragen

このスキルは何に役立ちますか？
構造化された Vercel スタイルの指針を使って、エージェントが React と Next.js のパフォーマンスをレビューし改善するのに役立ちます。
Vercel へのデプロイが必要ですか？
いいえ。多くのルールは任意の React または Next.js アプリケーションに適用できますが、一部の例では Vercel と Next.js の API に言及しています。
プロファイリングツールの代わりになりますか？
いいえ。レビュー指針とリファクタリングパターンを提供します。重要な変更については、実際のアプリケーションデータで引き続き測定する必要があります。
どのトピックが扱われますか？
async ウォーターフォール、バンドルサイズ、サーバーレンダリング、クライアントフェッチング、再レンダリング、レンダリングコスト、JavaScript ループを扱います。
例はこのスキルで実行できますか？
いいえ。リポジトリはドキュメントです。エージェントは例を読み、その考え方をあなたのプロジェクトに適用します。
チームはコードレビュー標準に使えますか？
はい。ルールファイルは、一貫したレビューコメント、移行計画、パフォーマンスチェックリストを支援できます。

Entwicklerdetails

Lizenz

MIT

Autorenversion

v1.0.0

Skillstore-Revision

r1

Repository

https://github.com/ZhanlinCui/Ultimate-Agent-Skills-Collection/tree/main/vercel-react-best-practices

Ref.

88a205c7f635a966e31156313b590d59007c5caa

Aktualität der Wartung

18.7.2026

Nutzung

100 Downloads · 287 Aufrufe

Dateistruktur

📁 rules/

📄 _sections.md

📄 _template.md

📄 advanced-event-handler-refs.md

📄 advanced-use-latest.md

📄 async-api-routes.md

📄 async-defer-await.md

📄 async-dependencies.md

📄 async-parallel.md

📄 async-suspense-boundaries.md

📄 bundle-barrel-imports.md

📄 bundle-conditional.md

📄 bundle-defer-third-party.md

📄 bundle-dynamic-imports.md

📄 bundle-preload.md

📄 client-event-listeners.md

📄 client-localstorage-schema.md

📄 client-passive-event-listeners.md

📄 client-swr-dedup.md

📄 js-batch-dom-css.md

📄 js-cache-function-results.md

📄 js-cache-property-access.md

📄 js-cache-storage.md

📄 js-combine-iterations.md

📄 js-early-exit.md

📄 js-hoist-regexp.md

📄 js-index-maps.md

📄 js-length-check-first.md

📄 js-min-max-loop.md

📄 js-set-map-lookups.md

📄 js-tosorted-immutable.md

📄 rendering-activity.md

📄 rendering-animate-svg-wrapper.md

📄 rendering-conditional-render.md

📄 rendering-content-visibility.md

📄 rendering-hoist-jsx.md

📄 rendering-hydration-no-flicker.md

📄 rendering-svg-precision.md

📄 rerender-defer-reads.md

📄 rerender-dependencies.md

📄 rerender-derived-state.md

📄 rerender-functional-setstate.md

📄 rerender-lazy-state-init.md

📄 rerender-memo.md

📄 rerender-transitions.md

📄 server-after-nonblocking.md

📄 server-cache-lru.md

📄 server-cache-react.md

📄 server-parallel-fetching.md

📄 server-serialization.md

📄 AGENTS.md

📄 metadata.json

📄 README.md

📄 SKILL.md

Mehr von ZhanlinCui

Alle anzeigen

Ähnliche Skills

Alle anzeigen