المهارات vercel-react-best-practices
📦

vercel-react-best-practices

مراجعة المحتوى r2 آمن ⚡ يحتوي على سكربتات⚙️ الأوامر الخارجية🌐 الوصول إلى الشبكة

تحسين تطبيقات React وNext.js

غالبًا ما تعاني تطبيقات React وNext.js من سلاسل انتظار متتابعة، وحزم كبيرة، وعمليات إعادة عرض مهدرة. تمنح هذه المهارة الوكلاء قواعد أداء عملية من Vercel لإجراء إعادة هيكلة أكثر أمانًا.

يدعم: Claude Codex Code(CC)
🥉 79 برونزي

التثبيت باستخدام Agent لدي

انسخ هذا الطلب إلى Agent لديك. يتضمن صفحة Skill المعتمدة وملف manifest.

طلب الوكيل
Review the Skillstore skill "vercel-react-best-practices" from https://skillstore.io/skills/am-will-vercel-react-best-practices.md and its manifest at https://skillstore.io/api/skills/am-will-vercel-react-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

يجب أن يواصل Agent عرض خطته وطلب أي تأكيد تفرضه سياسة الأمان.

موارد مهيّأة لـ Agents

استخدم هذه الروابط عندما يحتاج AI Agent أو crawler أو script إلى سياق نظيف بدلًا من قراءة الصفحة كاملة.

تفاصيل Markdown GET /skills/am-will-vercel-react-best-practices.md manifest موقَّع GET /api/skills/am-will-vercel-react-best-practices/manifest lockfile موقَّع GET /api/skills/am-will-vercel-react-best-practices/lockfile

اختبرها

جارٍ استخدام "vercel-react-best-practices". تنتظر صفحة Next.js بيانات المستخدم، والإعدادات، والشريط الجانبي قبل العرض.

النتيجة المتوقعة:

  • تبدأ الطلبات المستقلة عند حدود الصفحة.
  • تنقل بيانات الشريط الجانبي إلى مكون خادم خاص بها.
  • تضيف عنصرًا احتياطيًا لـ Suspense حول المحتوى البطيء فقط.
  • تسرد اختبارات لحالات التحميل والخطأ.

جارٍ استخدام "vercel-react-best-practices". يستورد مكون React الأيقونات من جذر حزمة ويعيد إنشاء المرشحات أثناء العرض.

النتيجة المتوقعة:

  • يستبدل الاستيرادات من جذر الحزمة باستيرادات أيقونات مباشرة أو استيرادات محسّنة مهيأة.
  • ينقل القيم المشتقة المكلفة خلف عوائد التحميل المبكرة.
  • يستخدم تحديثات الحالة الوظيفية للحصول على استدعاءات عكسية مستقرة.

جارٍ استخدام "vercel-react-best-practices". تستخدم لوحة معلومات localStorage وcookies ومستمعي مفاتيح عموميين.

النتيجة المتوقعة:

تنبّه المراجعة إلى قراءات التخزين، وتكرار المستمعين، ومفاضلات الترطيب. وتوصي بإبطال التخزين المؤقت، والاشتراكات المشتركة، وسكربتات مضمنة آمنة مع CSP.

التدقيق الأمني

آمن
v5 • ٢٣‏/٧‏/٢٠٢٦ فتح التقرير المرتبط بالإصدار

All 166 static findings were adjudicated as false positives after context review. They are documentation examples, Markdown formatting, public references, relative API examples, or keyboard event variables rather than executable malicious behavior. No prompt injection, data exfiltration, credential access, or automatic command execution was found.

51
الملفات التي تم فحصها
4,901
الأسطر التي تم تحليلها
0
عناصر المراجعة
0
تم تجاهل الإيجابيات الكاذبة

عوامل الخطر

⚡ يحتوي على سكربتات (12)
AGENTS.md:426 AGENTS.md:468 AGENTS.md:506 AGENTS.md:527 AGENTS.md:549 AGENTS.md:2148 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
⚙️ الأوامر الخارجية (50)
AGENTS.md:1475-1481 AGENTS.md:1597-1599 AGENTS.md:1964-1968 AGENTS.md:1977-1983 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/js-batch-dom-css.md:50-52 rules/js-hoist-regexp.md:16-20 rules/js-hoist-regexp.md:29-35 rules/rendering-hydration-no-flicker.md:72-78 SKILL.md:23 SKILL.md:24 SKILL.md:25 SKILL.md:26 SKILL.md:27 SKILL.md:28 SKILL.md:29 SKILL.md:30 SKILL.md:36 SKILL.md:37 SKILL.md:38 SKILL.md:39 SKILL.md:40 SKILL.md:44 SKILL.md:45 SKILL.md:46 SKILL.md:47 SKILL.md:48 SKILL.md:52 SKILL.md:53 SKILL.md:54 SKILL.md:55 SKILL.md:56 SKILL.md:60 SKILL.md:61 SKILL.md:65 SKILL.md:66 SKILL.md:67 SKILL.md:68
🌐 الوصول إلى الشبكة (15)
AGENTS.md:901 AGENTS.md:610 AGENTS.md:817 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
لم يكتشف أحدث تدقيق ثابت ودلالي مكتمل أي نتائج أمنية مؤكدة. ولا يثبت ذلك أن المهارة خالية من الآثار الجانبية.
دقّقه: codex عرض سجل التدقيق →
شارك واستشهد بهذا التقرير

شارك تقرير التقييم المرتبط بالإصدار والشارة المحايدة وبطاقة التضمين والاستشهادات. تعرض Skillstore الأدلة من دون أن تقرر ما إذا كانت هذه المهارة آمنة.

فتح التقرير المرتبط بالإصدار
تقييم الأمان

نسخ رابط التقرير

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

شارة Markdown

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

شارة HTML

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

بطاقة قابلة للتضمين

<iframe src="https://skillstore.io/embed/skills/am-will-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>
الاستشهادات الأكاديمية (APA · BibTeX · CFF)

اقتباس APA

am-will. (2026). vercel-react-best-practices security audit report (audit version 5) [Author version unspecified]. Skillstore. https://skillstore.io/skills/am-will-vercel-react-best-practices/audits/5

اقتباس BibTeX

@techreport{am-will-am-will-vercel-react-best-practices-2026, author = {am-will}, title = {vercel-react-best-practices security audit report (audit version 5)}, institution = {Skillstore}, year = {2026}, number = {5}, url = {https://skillstore.io/skills/am-will-vercel-react-best-practices/audits/5}, 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: "vercel-react-best-practices security audit report (audit version 5)" version: "unspecified" type: report authors: - name: "am-will" date-released: "2026-07-23" url: "https://skillstore.io/skills/am-will-vercel-react-best-practices/audits/5" identifiers: - type: other value: "skillstore:am-will-vercel-react-best-practices:audit:5" description: "Skillstore immutable audit report identifier"

مقارنة المتغيرات

4 متغيرات قابلة للتثبيت

تبقى مهارة كل مؤلف عنصراً مستقلاً قابلاً للتثبيت. يُرتب المتغير الموصى به وفق أدلة Skillstore.

سبب تصدر هذا المتغير

أعلى تقييم في Skillstore
vercel-labs موصى به

vercel-labs-vercel-react-best-practices

تقييم Skillstore 80
موثوقية الأدلة مرتفع
استخدام Skillstore 33
تم التحديث

2026-09-09

am-will الحالي

am-will-vercel-react-best-practices

تقييم Skillstore 79
موثوقية الأدلة مرتفع
استخدام Skillstore 27
تم التحديث

2026-09-09

sickn33

sickn33-vercel-react-best-practices

تقييم Skillstore 78
موثوقية الأدلة مرتفع
استخدام Skillstore 10
تم التحديث

2026-09-09

ZhanlinCui

zhanlincui-vercel-react-best-practices

تقييم Skillstore 72
موثوقية الأدلة مرتفع
استخدام Skillstore 104
تم التحديث

2026-09-09

تقييم Skillstore

سبب هذا التقييم موثوقية الأدلة: مرتفع
55
الهندسة المعمارية
85
قابلية الصيانة
87
المحتوى
70
المجتمع
91
الامتثال للمواصفات

ما الذي يمكنك بناؤه

مراجعة أداء ميزة

راجع ميزة React لاكتشاف سلاسل الانتظار القابلة للتجنب، واضطراب العرض، والحلقات المكلفة قبل الدمج.

إعادة هيكلة مسارات الخادم

حسّن مسارات Next.js عبر بث التخطيطات، وتخزين البيانات المشتركة مؤقتًا، وتقليص حمولات RSC.

توجيه تغييرات الكود بالذكاء الاصطناعي

اطلب من مساعد برمجة بالذكاء الاصطناعي تطبيق قائمة تحقق مرتبة حسب الأولوية للأداء أثناء إعادة هيكلة واجهة المستخدم.

جرّب هذه الموجّهات

مراجعة React أساسية 
راجع مكون React هذا بحثًا عن مشكلات الأداء الأعلى تأثيرًا من هذه المهارة. ركز على سلاسل الانتظار، وحجم الحزمة، وإعادة العرض. اشرح كل إصلاح بلغة واضحة.
إزالة سلاسل الانتظار في المسارات 
أعد هيكلة مسار Next.js هذا لإزالة سلاسل await المستقلة. ابدأ العمليات المستقلة مبكرًا واستخدم Suspense فقط حيث يمكن بث التخطيط بأمان.
تدقيق حدود التطبيق 
دقق هذه الميزة من حيث RSC boundary serialization، ونمو حزمة العميل، وعمليات الجلب المتكررة من العميل. أعد خطة عمل مرتبة حسب الأولوية مع المخاطر والاختبارات.
مقارنة عمليات التنفيذ 
قارن بين عمليتي تنفيذ لسير عمل لوحة المعلومات هذه وفقًا لقواعد المهارة. أوصِ بالإصدار الأفضل من حيث زمن الاستجابة، وسلوك الحزمة، واستقرار العرض.

أفضل الممارسات

  • ابدأ العمل غير المتزامن المستقل قبل انتظار النتائج التابعة.
  • مرر فقط الحقول التي يستخدمها العميل عبر حدود الخادم والعميل.
  • وثّق المفاضلات عندما تحسن قاعدة ما السرعة لكنها تغيّر سلوك التحميل.

تجنب

  • استيراد مكتبات كبيرة عبر ملفات barrel بدون إعداد تحسين في Next.js.
  • نقل كل عملية حسابية إلى memoization قبل فحص مسارات العودة المبكرة.
  • استخدام سكربتات ترطيب مضمنة بدون التحقق من القيم أو مراعاة CSP.

الأسئلة المتكررة

هل تشغل هذه المهارة الكود؟
لا. إنها توفر إرشادات لوكيل كي يطبقها أثناء تحرير الكود أو مراجعته.
هل هي مخصصة لـ Next.js فقط؟
لا. تنطبق العديد من قواعد React وJavaScript خارج Next.js، لكن إرشادات الخادم تركز على Next.js.
هل يمكنها أن تحل محل تحليل الأداء؟
لا. استخدم تحليل الأداء وتحليل الحزم لتأكيد التغييرات على المسارات المهمة.
هل تتطلب استضافة Vercel؟
لا. تذكر بعض الملاحظات ميزات Vercel، لكن معظم القواعد هي أنماط إطار عمل أو وقت تشغيل.
كيف ينبغي للوكلاء ترتيب القواعد حسب الأولوية؟
ابدأ بسلاسل الانتظار غير المتزامنة وحجم الحزمة، ثم راجع بيانات الخادم، وجلب بيانات العميل، واضطراب العرض.
هل كل الأمثلة آمنة للنسخ مباشرة؟
لا. كيّف الأمثلة مع قاعدة الكود لديك، وسياسة الأمان، وCSP، وإصدارات المكتبات.

تفاصيل المطور

المؤلف

am-will

الترخيص

MIT

مراجعة Skillstore

r2

تنبيه الإصدار

لم يعلن المؤلف عن إصدار.

المستودع

https://github.com/am-will/codex-skills/tree/main/skills/vercel-react-best-practices/

مرجع

89edfdc710d0846129dcee6a929477b04f08052c

حداثة الصيانة

٢٥‏/٧‏/٢٠٢٦

الاستخدام

22 تنزيلات · 189 مشاهدات

بنية الملفات

📄 AGENTS.md

📄 metadata.json

📄 README.md

📁 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-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

📄 SKILL.md

المزيد من am-will

عرض الكل

مهارات ذات صلة

عرض الكل