skill
محسن حزمة Next
تدقيق وتقليل عمل التحميل الأولي لمتصفح Next.js. يستخدم لمعالجة بطء بدء المسار، حزم العميل كبيرة الحجم، تبعيات المتصفح المكررة، أو الميزات التي يمكن أن تنتظر التفاعل.
نبذة
# محسن الحزم
## 1. تحديد النطاق
يحلل التطبيق بأكمله افتراضيا، ويغطي جميع المسارات والتبعيات المشتركة للعميل. ضيق النطاق فقط عندما يحدد المستخدم مسارا أو تبعية أو ميزة أو مجموعة فرعية أخرى. اختر وضع **التدقيق** أو **الإصلاح**. التدقيق هو الوضع الافتراضي: ينشئ مخرجات المحلل ويبلغ عن المرشحين مع ترك مصدر التطبيق والتبعيات وملفات القفل دون تغيير. يتطلب وضع الإصلاح طلبا صريحا لتغيير التطبيق. اسأل قبل تغيير السلوك المرئي أو التوقيت أو التوافق أو حدود الثقة. بالنسبة ل App Shell الثابت للمسار، استخدم [`next-cache-components-optimizer`](https://github.com/vercel/next.js/tree/canary/skills/next-cache-components-optimizer)؛ قم بتثبيته أولا إذا لم يكن متاحا (`npx skills add https://github.com/vercel/next.js/tree/canary/skills/next-cache-components-optimizer`). لأعمال الجلب المسبق للتنقل، استخدم [`next-partial-prefetching-optimizer`](https://github.com/vercel/next.js/tree/canary/skills/next-partial-prefetching-optimizer)؛ قم بتثبيته أولا إذا لم يكن متاحا (`npx skills add https://github.com/vercel/next.js/tree/canary/skills/next-partial-prefetching-optimizer`).
**تم:** تم تسجيل النطاق المحدد من قبل المستخدم أو نطاق التطبيق بأكمله، والوضع، والسلوك المقصود. طلب التقاط أو تصدير البيانات هو وضع تدقيق، وليس إذنا للإصلاح.
## 2. التقاط وتصدير خط أساس
شغل من دليل التطبيق باستخدام مدير الحزم الخاص به. اقرأ `next analyze --help` لخيارات الالتقاط و `next analyze export --help` لخيارات إعادة التشغيل في CLI المثبت. أعد استخدام لقطة محفوظة مختارة، أو التقط باسم مميز أولا؛ ثم قم بتصديرها عبر gzip بمستوى الضغط الافتراضي. احتفظ بملفات `.jsonl.gz` قبل/بعد منفصلة.
**متطلب Sandbox:** إذا كان sandbox الخاص بالوكيل يمنع ربط منفذ TCP (كما يفعل Codex)، فيجب عليه تشغيل التقاط `next analyze --output` خارج ال sandbox. لا تحاول الالتقاط داخل هذا ال sandbox، على الرغم من أن `--output` لا يقدم واجهة مستخدم المحلل.
شغل المسار في Bash:
```bash set -o pipefail # Capture only when a new baseline is needed pnpm exec next analyze --output --snapshot 'audit-before-unique-1' pnpm exec next analyze export --snapshot 'audit-before-unique-1' | gzip > /tmp/analyze-app-before.jsonl.gz ```
`--output` ينشئ ويحفظ مخرجات ثنائية/واجهة مستخدم دون تقديمها. `next analyze export` يقرأ لقطة محفوظة دون بناء؛ يكون الإخراج القياسي (stdout) سجل JSON واحدا مكتوبا لكل سطر، مع وجود أخطاء على الإخراج القياسي للأخطاء (stderr). احذف `--route` لتحليل التطبيق بأكمله؛ أضفه لمسار محدد من قبل المستخدم. يحافظ مرشح المسار على الرسم البياني لوحدة التطبيق بأكمله، لذا قم بتحديد نطاقه في الخطوة التالية.
بالنسبة ل `distDir` مخصص، أعد التشغيل باستخدام `--dist-dir <configured-directory>` (نسبي أو مطلق): الالتقاط يحمل تكوين التطبيق، وإعادة التشغيل لا يفعل ذلك. `--snapshot <name>` يختار اسما محتفظا به؛ الإغفال يختار أحدث لقطة. ينشئ الالتقاط اسما فريدا للطابع الزمني عند إغفاله، و**يستبدل** التقاطا موجودا عند إعادة استخدام اسم صريح. استخدم أسماء مميزة قبل/بعد، بما في ذلك الأسماء التي تحتوي على مسافات، للحفاظ على كلا خطي الأساس. للاستكشاف التفاعلي، التقط بدون `--output` لتقديم واجهة المستخدم؛ `next build --analyze` ينتج أيضا بيانات قابلة لإعادة التشغيل.
**تم:** تم تحديد الالتقاط المختار، ونجح التصدير، وتم تسجيل ملف خط الأساس، واسم اللقطة، ونطاق التحليل. تحقق من حالة خروج المسار بأكمله قبل معالجة الملف المضغوط: `pipefail` يمنع gzip من إخفاء تصدير فاشل. يتحقق التصدير من مسار واحد في كل مرة، لذا يمكن أن يترك الفشل أرشيفا جزئيا حتى لو قبله `gzip -t`. تجاهل الإخراج عند فشل التصدير أو gzip.
## 3. تفسير الأدلة
حل المخطط من **Next.js المثبت** للتطبيق، باستخدام مشغل Node الخاص به:
```bash pnpm exec node -p "require.resolve('next/analyze/graph-v1.schema.json')" ```
اقرأ أوصافه لمعاني السجلات، والوصلات، والإسناد، والتغطية. قم بفك ضغط التدفق باستخدام `gzip -dc /tmp/analyze-app-before.jsonl.gz` في نص برمجي تحليلي موجه بالأسطر بدلا من تحميل التفريغ بأكمله في السياق. استخدم المخطط لتفسير مساهمات العميل/الخادم عبر كل مسار في النطاق واختيار المقياس.
**تم:** تم تحديد مساهمات العميل/الخادم المنسوبة للمسار في خط الأساس والمقياس. تعامل مع هذا على أنه **دليل بناء**: المطالبات المتعلقة بطلبات المتصفح المرصودة، أو التوقيت، أو توفير النقل تحتاج إلى دليل منفصل.
## 4. شرح مرشح
افحص مصدر المشروع الفعلي والمستوردين الدقيقين. رتب مساهمات إخراج العميل عبر التطبيق بأكمله، أو ضمن النطاق المحدد من قبل المستخدم، حسب الحجم المنسوب، والتكرار، والتكلفة المحتملة لوقت التشغيل، والحاجة قبل التفاعل، ومخاطر الصحة.
### المجتمع ← تمرير القطع الأدنى
لعمليات التدقيق الواسعة التي تبحث عن فرص عبر ميزات متعددة أو قائمة مساهمين كبيرة، قم بتشغيل **اكتشاف المجتمع ← اختيار الهدف ← القطع الأدنى الموجه ← التحقق من المصدر** بعد الترتيب الأولي. اقرأ [طرق الرسم البياني](references/graph-methods.md) قبل إنشاء الرسم البياني أو تشغيل الحلول.
1. رتب المجتمعات المكتشفة حسب مساهمة إخراج العميل في النطاق.
التثبيت
شغل هذا الأمر
git clone https://github.com/vercel/next.js && cp -r next.js/skills/next-bundle-optimizer ~/.claude/skills/يعمل مع
خطوات التثبيت
استنسخ المستودع وانسخ مجلد `skills/next-bundle-optimizer` إلى دليل مهارات Claude الخاص بك. متوافق مع Claude Code وCursor وCodex وأي وكيل متوافق مع Agent Skills.
أسئلة شائعة
ما هي مهارة محسن حزمة Next؟
تدقيق وتقليل عمل التحميل الأولي لمتصفح Next.js. يستخدم لمعالجة بطء بدء المسار، حزم العميل كبيرة الحجم، تبعيات المتصفح المكررة، أو الميزات التي يمكن أن تنتظر التفاعل.
كيف أثبت محسن حزمة Next؟
شغل هذا الأمر في الطرفية:
git clone https://github.com/vercel/next.js && cp -r next.js/skills/next-bundle-optimizer ~/.claude/skills/مع أي أدوات ذكاء اصطناعي تعمل محسن حزمة Next؟
تعمل مع claude_app، claude_code، claude_api، cursor، codex، windsurf، cline، zed.
من طور محسن حزمة Next؟
طورها Vercel، وتصدر بترخيص MIT.
هل محسن حزمة Next مجانية؟
نعم، يمكنك استخدامها مجانا وفق ترخيص MIT.
git clone https://github.com/anthropics/skills && cp -r skills/skills/claude-api ~/.claude/skills/
npx skills add mattpocock/skills
npx skills add mattpocock/skills
npx skills add mattpocock/skills
npx skills add mattpocock/skills
npx skills add microsoft/azure-skills
افحص قبل التثبيت
شغل أي مصدر عبر فحوصاتنا - الظهور في الذكاء الاصطناعي والأمان والأداء واكتشاف التقنيات.
مختبر وكلاء الذكاء الاصطناعي
اختبار الذكاء الاصطناعي
فحص أمني تلقائي للموقع
الأمان
اختبار جودة المحتوى العربي بالذكاء الاصطناعي
جودة المحتوى
كاشف منصة الموقع
الترحيل
محلل سرعة الصفحة
الأداء
تدقيق الظهور في محركات الذكاء الاصطناعي
الظهور في الذكاء الاصطناعي
مولد ملف llms.txt
الظهور في الذكاء الاصطناعي
منشئ البيانات المنظمة
الظهور في الذكاء الاصطناعي
مقياس سهولة القراءة بالعربية
جودة المحتوى
حاسبة تكاليف الذكاء الاصطناعي
اختبار الذكاء الاصطناعي
محلل العناوين العربية
جودة المحتوى