التطوير والاختبار مميز

Vercel React Best Practices

بواسطة Vercel Engineering (via ui-skills.com) 3.7k نجوم GitHub

إرشادات أداء React وNext.js من Vercel Engineering — جلب البيانات وتحسين الـ bundle وأنماط الرندر.

#react#nextjs#performance#vercel

Claude Code Codex

نظرة عامة

السكيل ده بيطبّق إرشادات أداء React وNext.js من Vercel Engineering لما تكتب أو تراجع أو تعيد هيكلة الكود. بيغطي أنماط الكومبوننتس المثلى وجلب البيانات وتحسين الـ bundle والـ Core Web Vitals. بيشتغل مع أي شغل React/Next.js علشان يحافظ على أنماط الأداء صح.

بتنفع في إيه

إعادة هيكلة صفحة Next.js بطيئة
تحسين حجم الـ bundle
اختيار أنماط جلب البيانات الصح
مراجعة كود React من ناحية الأداء

التثبيت

التثبيت في Claude Code

# ضيف الـ marketplace وبعدين ثبّت المهارة في Claude Code:
/plugin marketplace add ibelick/ui-skills
/plugin install vercel-react-best-practices

# أو ثبّتها يدويًا في ~/.claude/skills:
git clone https://github.com/ibelick/ui-skills.git
cp -r ui-skills/vercel-react-best-practices ~/.claude/skills/vercel-react-best-practices

التثبيت في Codex

# Codex بيقرأ مهارات SKILL.md من ~/.codex/skills (اكتشاف تلقائي):
git clone https://github.com/ibelick/ui-skills.git
cp -r ui-skills/vercel-react-best-practices ~/.codex/skills/vercel-react-best-practices

# وبعدين استخدم المهارة في Codex — بتتحمّل وقت الحاجة.

زيارة المصدر (GitHub)

استكشف أدوات AI

أدوات AI تكمل شغلك — للمصممين والمطورين

اقرأ مقالات عن AI

نصايح عملية في التصميم والذكاء الاصطناعي

أدوات مشابهة

التطوير والاختبار

MCP Builder

توجيه إنشاء سيرفرات Model Context Protocol لربط الـ APIs والأدوات بالـ AI agents.

Claude Code Codex

التطوير والاختبار

Superpowers

مكتبة سكيلز أساسية فيها +20 أداة وفلو مجرّبة وقابلة للتركيب لمهام تطوير الـ agent اليومية.

Claude Code Codex

التطوير والاختبار

Claude API Reference

مرجع لـ Claude API وAnthropic SDK — أسماء الموديلات والأسعار والباراميترات والـ streaming واستخدام الأدوات والـ MCP والـ caching والتوكنز.

Claude Code Codex