نصائح لتقليل حجم تطبيقات الموبايل المصممة بـ فلاتر Flutter
هل سبق لك نشر تطبيق Flutter وتفاجأت بحجم التنزيل الكبير؟ إليك بعض الطرق لجعل تطبيقك أصغر ويوفر للمستخدمين في مساحة التخزين.
الصور 🔗
استخدم أيقونات SVG عالية الجودة: بدلاً من استخدام صيغ JPG أو PNG الكبيرة، استخدم رسومات المتجه القابلة للتوسيع (SVG) للرموز والصور المتجهة. تتمتع أيقونات SVG بحجم أصغر بكثير ولن تفقد جودتها عند تغيير حجمها لشاشات مختلفة.
استغل قوة WEBP: بالنسبة للصور، يمكنك التفكير في استخدام WEBP بدلاً من JPG أو PNG. يوفر جودة صورة مشابهة ولكن بحجم أصغر (حوالي 25٪ أصغر!). يمكنك مراجعة دليل مطوري Google لمزيد من المعلومات حول WEBP: https://developers.google.com/speed/webp .
التخلص من العناصر غير المستخدمة 🔗
يمكن لـ Flutter إزالة الرموز غير المستخدمة من الخطوط مثل Material و Cupertino و FontAwesome. تسمى هذه العملية “التخلص من الشجرة” (tree shaking).
التخلص من الأشياء غير المستخدَمة على iOS: هل تبني التطبيق باستخدام Xcode؟ قم بتعيين متغير البيئة
TREE_SHAKE_ICONS
.التخلص من الأشياء غير المستخدَمة على Android: أضف خاصية
tree-shake-icons
إلى ملفgradle.properties
الخاص بك.
عظمة الضغط 🔗
نعلم جميعاً كيفية ضغط صور JPG و PNG، ولكن هل تعلم أنه يمكن أيضاً ضغط صور SVG و WEBP؟
اضغط تحريك الرسوم المتحركة: اضغط على تلك الرسوم المتحركة لتوفير مساحة!
استخدم ضغط gzip على كل شيء: استخدم ضغط gzip لتقليل حجم الملفات مثل ملفات اللغة (JSON). يوضح مقتطف الكود المقدم كيفية استخدام gzip لضغط ملف. يمكنك العثور على مزيد من المعلومات حول هذه التقنية هنا .
final String response = await rootBundle.loadString('assets/en_us.json');
List<int> original = utf8.encode(response);
List<int> compressed = gzip.encode(original);
List<int> decompress = gzip.decode(compressed);
final enUS = utf8.decode(decompress);
نصائح خاصة بنظام Android 🔗
استفد من Proguard: يساعد Proguard في تقليص حجم وتحسين الكود الخاص بك. تتضمن الإرشادات خطوات لإضافة قواعد Proguard إلى ملفات
android/app/build.gradle
وandroid/app/proguard-rules.pro
الخاصة بك. يمكنك الاطلاع على هذه المقالة لمزيد من المعلومات حول Proguard.أضف إلى ملف
android/app/build.gradle
android { buildTypes { getByName("release") { // يسمح بتقليص الكود والتحسين minifyEnabled = true // يسمح بتقليص الموارد shrinkResources = true // يسمح بقواعد Proguard proguardFiles( getDefaultProguardFile("proguard-android-optimize.txt")), "proguard-rules.pro" ) } } }
أضف إلى ملف
android/app/proguard-rules.pro
## Flutter wrapper -keep class io.flutter.app.** { *; } -keep class io.flutter.plugin.** { *; } -keep class io.flutter.util.** { *; } -keep class io.flutter.view.** { *; } -keep class io.flutter.** { *; } -keep class io.flutter.plugins.** { *; } -keep class com.google.firebase.** { *; } // قم بإلغاء تعليق هذا إذا كنت تستخدم firebase في المشروع -dontwarn io.flutter.embedding.** -ignorewarnings
عمل Obfuscation للأمان والحجم: يؤدي الـ obfuscation للكود الخاص بك إلى صعوبة فهمه ويقلل من حجمه. تتضمن الإرشادات روابط حول كيفية تمكين التشويه لنظامي التشغيل Android و iOS.
لـ Android، أضف هذا السطر إلى الملف
/android/gradle.properties
extra-gen-snapshot-options=--obfuscate
خطوط Google حسب الطلب: استخدم حزمة
google_fonts
لتنزيل الخطوط بشكل ديناميكي فقط عند استخدامها من قبل تطبيقك. يوفر هذا مساحة عن طريق تجنب أشكال الخطوط غير الضرورية. يمكنك الاطلاع على الحزمة على pub.dev: https://pub.dev/packages/google_fonts .تخزين الصور المؤقتة: تقوم حزمة
cached_network_image
تلقائيًا بتخزين الصور التي تم تنزيلها مؤقتًا، مما يوفر المساحة وعرض النطاق الترددي. تجدها على pub.dev: https://pub.dev/packages/cached_network_image .أقوى التحسينات: قم بتمكين التحسينات الأكثر قوة في ملف
android/gradle.properties
الخاص بك لإزالة الكود غير المستخدم ودمج الفئات، مما يؤدي إلى تطبيق أصغر. وذلك عن طريق إضافة هذا السطرandroid.enableR8.fullMode=true
. لمزيد من المعلومات، اقرأ هذا الدليل من AndroidDeveloper .ضغط المكتبات الأصلية: قلل من حجم المكتبات الأصلية لتوفير مساحة على الأجهزة. راجع الرابط المقدم لمزيد من المعلومات. أضف هذا السطر
android.bundle.enableUncompressedNativeLibs=true
إلى نهاية هذا الملفandroid/gradle.properties
. اقرأ المزيد حول هذا الموضوع على StackOverflow .إزالة معلومات الـ Debug: إزالة معلومات الـ debug من الكود تقلل حجم ملف الـ apk بشكل ملحوظ. استخدم هذا الأمر للحصول على تطبيق بدون معلومات الـ debug
flutter build appbundle --split-debug-info=/<path-to-export>
.
فكّر مقدماً: الأجزاء المؤجلة (Deferred Components) 🔗
تسمح لنا Flutter بأن نبني تطبيقات تقوم بتنزيل إمكانيات وأجزاء عند الإحتياج لها أثناء استخدام التطبيق. هذه الميزة تقلل حجم تنزيل التطبيق وتجعل المستخدمين الذين يريدون الإمكانيات فقط هم من يتم تنزيلها على هواتفهم. اعرف أكثر عن هذه الخاصية الرائعة deferred components على الشروحات الرسمية لـ Flutter من هنا .
ابحث عن الأجزاء الضخمة 🔗
تحديد الحزم الثقيلة: استخدم الأمر
flutter build
مع العلم--analyze-size
لتحديد الحزم الكبيرة في تطبيقك. تعرض الإرشادات أوامر محددة لتحليل حزم تطبيقات Android، وتطبيقات Android APK، وإصدارات iOS.لتطبيق حزمة Android:
flutter build appbundle --target-platform android-arm64 --analyze-size
لتطبيق Android APK:
flutter build apk --target-platform android-arm64 --analyze-size
لـ iOS:
flutter build ios --analyze-size
باتباع هذه النصائح، يمكنك تقليل حجم تطبيق Flutter الخاص بك بشكل ملحوظ، مما يجعله ممتعًا للتنزيل والاستخدام.
المراجع والمصادر (باللغة الإنجليزية) 🔗
- تقليل حجم ملف apk : https://developer.android.com/topic/performance/reduce-apk-size
- تقليل الكود : https://developer.android.com/studio/build/shrink-code
- تقليل حجم تطبيقات Flutter : https://suryadevsingh24032000.medium.com/size-matters-reducing-flutter-app-size-best-practices-ca992207782
- تقليل حجم تطبيق Flutter : https://itnext.io/reducing-flutter-app-size-570db9810ebb
- عمل تشفير obfuscation لتطبيقات Flutter : https://newbedev.com/how-to-obfuscate-flutter-apps
أتمنى أن تكون قد استفدت من الموضوع ، إن كنت تعرف أي شخص يُمكنه الإستفادة من هذه المعلومات، ارسل له رابط هذا المقال. إن أردت معرفة الموضوعات الجديدة بعد نشرها مباشرةً على موقع أبانوب حنا ، تابعني على يوتيوب و تيليجرام ، و فيسبوك ، و واتساب .
![waffarx cash back](/img/waffarx-banner.png)