📋 محتويات الصفحة
📖 الوصف
Import Cost هي إضافة لـ VS Code تعرض حجم كل حزمة مستوردة في الكود. تساعد المطورين على اتخاذ قرارات مستنيرة حول dependencies وتحديد الحزم الكبيرة.
🎯 يستخدم في
مجالات استخدام هذه الأداة
مراقبة حجم الحزم (Bundle Size)
اكتشاف الحزم الثقيلة
اتخاذ قرارات مدروسة حول libraries
تحسين أداء التطبيق
مراجعة Pull Requests
تحسين Tree Shaking
✨ المميزات
أبرز مميزات هذه الأداة
عرض حجم الحزمة بجانب import statement
عرض حجم Gzipped
تمييز الحزم الكبيرة (أحمر)
تمييز الحزم المتوسطة (أصفر)
تحديث تلقائي عند الحفظ
دعم JavaScript و TypeScript
دعم ESM و CommonJS
يعمل في الخلفية بدون تأثير على الأداء
⚠️ العيوب
نقاط يجب مراعاتها
قراءة فقط (لا يحل المشاكل)
قد لا يكون دقيقاً 100%
يحتاج وقت في المشاريع الكبيرة
لا يدعم جميع الـ bundlers configurations
💻 مثال على الاستخدام
كيفية استخدام هذه الأداة
// .vscode/settings.json
{
"importCost.bundleSizeDecoration": "both",
"importCost.maxBundleSize": 500000,
"importCost.maxGzipSize": 100000,
"importCost.bundleSizeConcurrency": 5
}📚 أدوات أخرى في Extensions
قد يعجبك أيضاً
Auto Import
إضافة VS Code لإضافة الاستيرادات تلقائياً (Auto Import Extension)
Auto Import
إضافة VS Code لإضافة الاستيرادات تلقائياً (Auto Import Extension)
Bracket Pair Colorizer
⭐إضافة VS Code لتلوين الأقواس
Bracket Pair Colorizer
⭐إضافة VS Code لتلوين الأقواس
Color Picker
إضافة VS Code لاختيار الألوان
Color Picker
إضافة VS Code لاختيار الألوان