تحسين أداء الصور

تنظيم صفحاتك في مجموعات يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.

يمكن أن يؤدي استخدام الصور إلى حدوث مشاكل في الأداء بسرعة إذا لم تكن حذيفًا. يمكنك بسهولة العثور على OutOfMemoryError عند العمل باستخدام ملفات بترميز ثنائي كبير. اتّبِع أفضل الممارسات التالية لضمان تحقيق تطبيقك أفضل أداء ممكن.

تحميل حجم الصورة النقطية الذي تحتاجه فقط

تحتوي معظم الهواتف الذكية على كاميرات عالية الدقة تُنشئ ملفات صور كبيرة. إذا كنت تعرض صورة على الشاشة، عليك إمّا تقليل درجة دقتها أو تحميل الصورة بما يصل إلى حجم حاوية الصورة فقط. إنّ loadingتحميل الصور بشكلٍ مستمر أكبر من اللازم يمكن أن يؤدي إلى استنفاد ذاكرة التخزين المؤقت لوحدة معالجة الرسومات، ما يؤدي إلى معالجة واجهة المستخدم بشكلٍ أقل فعالية.

لإدارة أحجام الصور:

• عليك تصغير ملفات الصور إلى أصغر حجم ممكن (بدون التأثير في صورة الناتج).
• ننصحك بتحويل صورك إلى تنسيق WEBP بدلاً من تنسيقات JPEG أو PNG.
• احرص على تقديم صور أصغر حجمًا لدرجات دقة الشاشة المختلفة (راجِع النصيحة رقم 3)،
• استخدِم مكتبة لتحميل الصور، والتي تُقلّل حجم صورتك لتلائم حجم العرض على الشاشة. يمكن أن يساعد ذلك في تحسين أداء تحميل الشاشة.

استخدِم الرسومات المتجهّة بدلاً من الصور المخصّصة للطباعة كلما أمكن.

عند تمثيل شيء ما بشكل مرئي على الشاشة، عليك تحديد ما إذا كان يمكن تمثيله كعنصر متّجه أم لا. تفضيل صور المتجه على الصور النقطية، لأنها لا تتقطع عند تغيير حجمها إلى أحجام مختلفة. ومع ذلك، لا يمكن تمثيل كل شيء كعنصر مرئي، إذ لا يمكن تحويل الصور الملتقطة بالكاميرا إلى عنصر مرئي.

توفير موارد بديلة لأحجام الشاشات المختلفة

إذا كنت بصدد شحن صور مع تطبيقك، ننصحك بتوفير مواد عرض مختلفة المقاسات لدرجات دقة مختلفة للأجهزة. ويمكن أن يساعد ذلك في تقليل حجم تنزيل التطبيق على الأجهزة، وتحسين الأداء إذ سيتم تحميل صورة ذات دقة أقل على جهاز أقل دقة. لمزيد من المعلومات حول توفير bitmaps بديلة لمختلف أحجام الأجهزة، يمكنك الاطّلاع على مستندات bitmaps البديلة.

عند استخدام ImageBitmap، اتصل بـ prepareToDraw قبل الرسم.

عند استخدام ImageBitmap، لبدء عملية تحميل الزخرفة إلى وحدة معالجة الرسومات، يمكنك طلب ImageBitmap#prepareToDraw() قبل رسمها. ويساعد ذلك GPU في إعداد النسيج وتحسين أداء عرض المرئيات على الشاشة. تُجري معظم مكتبات تحميل الصور هذا التحسين، ولكن إذا كنت تعمل مع فئة ImageBitmap بنفسك، عليك أخذ ذلك في الاعتبار.

يُفضَّل تمرير Int DrawableRes أو عنوان URL كمَعلمات في العنصر القابل للتجميع بدلاً من Painter.

بسبب تعقيدات التعامل مع الصور (على سبيل المثال، قد تكون كتابة دالة "يساوي" في Bitmaps أمرًا مكلفًا من الناحية الحسابية)، لم يتم فعليًا تصنيف واجهة برمجة تطبيقات Painter على أنّها فئة ثابتة. يمكن أن تؤدي الفئات غير المستقرة إلى عمليات إعادة تركيب غير ضرورية لأنّ المُجمِّع لا يمكنه استنتاج ما إذا كانت البيانات قد تغيّرت بسهولة.

لذلك، من الأفضل تمرير عنوان URL أو معرّف مورد قابل للرسم كمَعلمات إلى العنصر القابل للتجميع، بدلاً من تمرير Painter كمَعلمة.

// Prefer this:
@Composable
fun MyImage(url: String) {

}
// Over this:
@Composable
fun MyImage(painter: Painter) {

}

عدم تخزين صورة نقطية في الذاكرة لمدة أطول مما تحتاج إليه

كلما زاد عدد ملفات الخطوط النقطية التي تحمّلها إلى الذاكرة، زادت احتمالية نفاد الذاكرة على الجهاز. على سبيل المثال، في حال تحميل قائمة كبيرة من عناصر تركيب الصور على الشاشة، استخدِم LazyColumn أو LazyRow لضمان شغّل الذاكرة عند الانتقال إلى قائمة كبيرة.

عدم حزم صور كبيرة مع ملف AAB/APK

إنّ أحد أهم أسباب حجم تنزيل التطبيق الكبير هو الرسومات التي يتم تجميعها داخل حِزمة AAB أو ملف APK. استخدِم أداة محلل APK للتأكّد من عدم حزم ملفات صور أكبر من الحجم المطلوب. يمكنك تقليل الأحجام أو التفكير في وضع الصور على خادم وتنزيلها عند الحاجة فقط.