मैंने 15 बार Android पर छवि प्रसंस्करण कैसे त्वरित किया

रनटाइम में छवि प्रसंस्करण का अनुकूलन कैसे करें जब 6 छवियां बनाने के लिए आवश्यक है, जिनमें से प्रत्येक 15-16 पीएनजी के क्रमिक रूप से मढ़ा हुआ है, रास्ते में एक आउटऑफ़मैरीएक्स अपवाद प्राप्त किए बिना?

अपना पालतू एप्लिकेशन विकसित करते समय, मुझे इमेज प्रोसेसिंग की समस्या का सामना करना पड़ा। मैं Google के लिए अच्छे Googlecases प्रदान नहीं कर सका, इसलिए मुझे अपने रेक पर चलना पड़ा और अपने दम पर एक साइकिल का आविष्कार करना पड़ा।
इसके अलावा, विकास के दौरान, जावा से कोटलिन के लिए एक प्रवासन था, इसलिए किसी बिंदु पर कोड का अनुवाद किया जाएगा।

कार्य

जिम में प्रशिक्षण के लिए आवेदन। आवेदन क्रम में प्रशिक्षण के परिणामों के आधार पर मांसपेशियों के काम का एक नक्शा बनाना आवश्यक है।
दो लिंग: एम और जी। विकल्प एम पर विचार करें, क्योंकि एम के लिए सब कुछ समान है।
6 छवियों को एक साथ बनाया जाना चाहिए: 3 अवधि (एक प्रशिक्षण सत्र, प्रति सप्ताह, प्रति माह) x 2 दृश्य (सामने, पीछे)

इस तरह की प्रत्येक छवि में सामने के दृश्य के लिए मांसपेशी समूहों की 15 छवियां और पीछे के दृश्य के लिए 14 चित्र शामिल हैं। नींव (सिर, हाथ और पैर) की प्लस 1 छवि। कुल मिलाकर, सामने का दृश्य इकट्ठा करने के लिए, आपको 16 छवियों को पीछे से, 15 से सुपरिमंपोज करना होगा।

दोनों पक्षों के लिए केवल 23 मांसपेशी समूह (15 + 14! = 23 के साथ उन लोगों के लिए, एक छोटा सा स्पष्टीकरण - कुछ मांसपेशियां दोनों तरफ "दृश्यमान" हैं)।

पहले सन्निकटन में एल्गोरिथ्म:

1. पूर्ण वर्कआउट के डेटा के आधार पर, HashMap <स्ट्रिंग, फ्लोट> बनाया गया है, स्ट्रिंग मांसपेशी समूह का नाम है, फ्लोट 0 से 10 तक लोड की डिग्री है।
2. 23 में से प्रत्येक पेशी 0 से रंग में शामिल नहीं है (10) (अधिकतम लोड)।
3. दो छवियों (सामने, पीछे) में ओवरले रिपेंटेड मांसपेशी छवियों।
4. हम सभी 6 छवियों को बचाते हैं।

24-बिट मोड के साथ आकार 1500x1500 px के 31 (16 + 15) स्टोर करने के लिए, 31x1500x1500x24bit = 199 एमबी रैम की आवश्यकता होती है। जब आप ~ 30-40 MB से अधिक हो जाते हैं, तो आपको एक OutOfememoryException मिलती है। इसके विपरीत, आप एक ही समय में सभी छवियों को संसाधनों से लोड नहीं कर सकते, क्योंकि आपको रिसेप्शन प्राप्त नहीं करने के लिए संसाधनों को मुक्त करने की आवश्यकता है। इसका मतलब है कि आपको क्रमिक रूप से ओवरले छवियों की आवश्यकता है। एल्गोरिथ्म निम्नलिखित में बदल जाता है:

पूर्ण वर्कआउट के डेटा के आधार पर, हाशप <स्ट्रिंग, फ्लोट>, स्ट्रिंग - मांसपेशी, फ्लोट - 0 से 10 तक लोड स्तर बनाया जाता है।

6 छवियों में से प्रत्येक के लिए चक्र:

1. BitmapFactory.decodeResource () संसाधन प्राप्त करें।
2. 23 में से प्रत्येक पेशी 0 से रंग में शामिल नहीं है (10) (अधिकतम लोड)।
3. एक कैनवस पर ओवरले रिपेंस्ड मांसपेशियों की छवियों।
4. Bitmap.recycle () ने एक संसाधन को मुक्त किया।

हम AsyncTask का उपयोग करके एक अलग थ्रेड में कार्य करते हैं। प्रत्येक टास्क में, दो इमेज क्रमबद्ध रूप से बनाई जाती हैं: एक फ्रंट व्यू और एक बैक व्यू।

private class BitmapMusclesTask extends AsyncTask<Void, Void, DoubleMusclesBitmaps> { private final WeakReference<HashMap<String, Float>> musclesMap; BitmapMusclesTask(HashMap<String, Float> musclesMap) { this.musclesMap = new WeakReference<>(musclesMap); } @Override protected DoubleMusclesBitmaps doInBackground(Void... voids) { DoubleMusclesBitmaps bitmaps = new DoubleMusclesBitmaps(); bitmaps.bitmapBack = createBitmapMuscles(musclesMap.get(), false); bitmaps.bitmapFront = createBitmapMuscles(musclesMap.get(), true); return bitmaps; } @Override protected void onPostExecute(DoubleMusclesBitmaps bitmaps) { super.onPostExecute(bitmaps); Uri uriBack = saveBitmap(bitmaps.bitmapBack); Uri uriFront = saveBitmap(bitmaps.bitmapFront); bitmaps.bitmapBack.recycle(); bitmaps.bitmapFront.recycle(); if (listener != null) listener.onUpdate(uriFront, uriBack); } } public class DoubleMusclesBitmaps { public Bitmap bitmapFront; public Bitmap bitmapBack; } 

सहायक वर्ग DoubleMusclesBitmaps को केवल दो बिटमैप चर वापस करने की आवश्यकता है: सामने का दृश्य और पीछे का दृश्य। आगे देखते हुए, DoubleMusclesBitmaps जावा वर्ग को कोटलिन में जोड़ी <Bitmap, Bitmap> द्वारा प्रतिस्थापित किया जाता है।

ड्राइंग

मूल्यों के संसाधनों में रंग color.xml।

 <?xml version="1.0" encoding="utf-8"?> <resources> <color name="muscles_color0">#BBBBBB</color> <color name="muscles_color1">#ffb5cf</color> <color name="muscles_color2">#fda9c6</color> <color name="muscles_color3">#fa9cbe</color> <color name="muscles_color4">#f890b5</color> <color name="muscles_color5">#f583ac</color> <color name="muscles_color6">#f377a4</color> <color name="muscles_color7">#f06a9b</color> <color name="muscles_color8">#ee5e92</color> <color name="muscles_color9">#eb518a</color> <color name="muscles_color10">#e94581</color> </resources> 

एक दृश्य बनाएं

 public Bitmap createBitmapMuscles(HashMap<String, Float> musclesMap, Boolean isFront) { Bitmap musclesBitmap = Bitmap.createBitmap(1500, 1500, Bitmap.Config.ARGB_8888); Canvas resultCanvas = new Canvas(musclesBitmap); for (HashMap.Entry entry : musclesMap.entrySet()) { int color = Math.round((float) entry.getValue()); //         color = context.getResources().getColor(context.getResources() .getIdentifier("muscles_color" + color, "color", context.getPackageName())); drawMuscleElement(resultCanvas, entry.getKey(), color); } return musclesBitmap; } 

एकल मांसपेशी ओवरले

 private void drawMuscleElement(Canvas resultCanvas, String drawableName, @ColorInt int color) { PorterDuff.Mode mode = PorterDuff.Mode.SRC_IN; Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); Bitmap bitmapDst = BitmapFactory.decodeResource(context.getResources(), context.getResources().getIdentifier(drawableName, "drawable", context.getPackageName())); bitmapDst = Bitmap.createScaledBitmap(bitmapDst, 1500, 1500, true); paint.setColorFilter(new PorterDuffColorFilter(color, mode)); resultCanvas.drawBitmap(bitmapDst, 0, 0, paint); bitmapDst.recycle();//  } 

हम 3 जोड़ी छवियों की पीढ़ी शुरू करते हैं।

 private BitmapMusclesTask taskLast; private BitmapMusclesTask taskWeek; private BitmapMusclesTask taskMonth; private void startImageGenerating(){ taskLast = new BitmapMusclesTask(mapLast); taskLast.execute(); taskWeek = new BitmapMusclesTask(mapWeek); taskWeek.execute(); taskMonth = new BitmapMusclesTask(mapMonth); taskMonth.execute(); } 

हम शुरू करते हैं IGemGenerating ():

 > start 1549350950177 > finish 1549350959490 diff=9313 ms 

यह ध्यान दिया जाना चाहिए कि पढ़ने के संसाधनों में बहुत समय लगता है। प्रत्येक जोड़ी छवियों के लिए, संसाधनों से 29 पीएनजी फाइलें डिकोड की जाती हैं। मेरे मामले में, छवियां बनाने की कुल लागत में से, बिटमैपफैक्ट्री.ऑडब्लॉक सोर्स () फ़ंक्शन खर्च करता है ~ 75% समय: ~ 6960 एमएस।

विपक्ष:

1. मुझे समय-समय पर OutOfMemoryException मिलती है।
2. प्रसंस्करण में 9 सेकंड से अधिक समय लगता है, और यह एमुलेटर (!) पर है "औसत" (पुरानी खान) फोन में यह 20 सेकंड तक पहुंच गया।
3. सभी परिणामी [मेमोरी] लीक के साथ AsyncTask।

पेशेवरों:
प्रायिकता के साथ (1-OutOfMemoryException) चित्र खींचे जाते हैं।

आंसर-की सेवा में AsyncTask

AsyncTask को छोड़ने के लिए, IntentServie पर स्विच करने का निर्णय लिया गया, जिसमें चित्र बनाने का कार्य किया गया था। सेवा पूरी होने के बाद, अगर ब्रॉडकास्टसीवर चल रहा है, तो हमें सभी छह उत्पन्न छवियों के उरई मिल जाते हैं, अन्यथा छवियां बस बच जाती थीं ताकि अगली बार जब उपयोगकर्ता एप्लिकेशन खोलता है, तो निर्माण प्रक्रिया की प्रतीक्षा करने की कोई आवश्यकता नहीं है। उसी समय, ऑपरेटिंग समय में बदलाव नहीं हुआ, लेकिन एक माइनस - मेमोरी लीक से पता चला, दो और माइनस थे।

उपयोगकर्ताओं को ऐसे समय के लिए छवियों के निर्माण की उम्मीद करने के लिए मजबूर करना, निश्चित रूप से, असंभव है। अनुकूलन करने की आवश्यकता है।

ऑप्टिमाइज़ेशन के तरीके:

1. छवि प्रसंस्करण।
2. LruCache जोड़ना।

छवि प्रसंस्करण

सभी स्रोत पीएनजी संसाधन 1500x1500 पीएक्स आकार के हैं। उन्हें 1080x1080 पर कम करें।
जैसा कि आप दूसरी तस्वीर में देख सकते हैं, सभी स्रोत कोड चौकोर हैं, मांसपेशियां जगह में हैं, और वास्तविक उपयोगी पिक्सेल एक छोटे से क्षेत्र पर कब्जा कर लेते हैं। यह तथ्य कि सभी मांसपेशी समूह पहले से ही प्रोग्रामर के लिए सुविधाजनक हैं, लेकिन प्रदर्शन के लिए तर्कसंगत नहीं हैं। हम सभी स्रोत कोडों में अतिरिक्त (फसल) काटते हैं, प्रत्येक मांसपेशी समूह की स्थिति (x, y) को रिकॉर्ड करने के लिए ताकि बाद में इसे सही जगह पर लागू किया जा सके।

पहले दृष्टिकोण में, मांसपेशी समूहों की सभी 29 छवियां आधार पर पुन: अंकित और सुपरिम्पोज की गईं। आधार में केवल सिर, हाथ और पैर के हिस्से शामिल थे। हम आधार को बदलते हैं: अब इसमें सिर, हाथ और पैर के अलावा सभी अन्य मांसपेशी समूह शामिल हैं। हम सब कुछ ग्रे color_muscle0 में पेंट करते हैं। यह उन मांसपेशी समूहों को पुन: उत्पन्न करने और न लगाने की अनुमति देगा जो इसमें शामिल नहीं थे।

अब सभी स्रोत इस तरह दिखते हैं:

LruCache

मूल छवियों के अतिरिक्त प्रसंस्करण के बाद, कुछ ने थोड़ी सी मेमोरी लेना शुरू कर दिया, जिसके कारण LruCache का उपयोग करके .recycle () विधि के साथ प्रत्येक ओवरले के बाद पुन: उपयोग करने (उन्हें मुक्त नहीं करना) के बारे में सोचा। हम स्रोत छवियों को संग्रहीत करने के लिए एक वर्ग बनाते हैं, जो एक साथ संसाधनों से पढ़ने के कार्य को मानता है:

 class LruCacheBitmap(val context: Context) { private val lruCache: LruCache<String, Bitmap> init { val maxMemory = (Runtime.getRuntime().maxMemory() / 1024).toInt() val cacheSize = maxMemory / 4 lruCache = object : LruCache<String, Bitmap>(cacheSize) { override fun sizeOf(key: String, bitmap: Bitmap): Int { return bitmap.byteCount } } } fun getBitmap(drawableName: String): Bitmap? { return if (lruCache.get(drawableName) != null) lruCache.get(drawableName) else decodeMuscleFile(drawableName) } fun clearAll() { lruCache.evictAll() } private fun decodeMuscleFile(drawableName: String): Bitmap? { val bitmap = BitmapFactory.decodeResource(context.resources, context.resources.getIdentifier(drawableName, "drawable", context.packageName)) if (bitmap != null) { lruCache.put(drawableName, bitmap) } return bitmap } } 

छवियाँ तैयार की जाती हैं, संसाधन डिकोडिंग को अनुकूलित किया जाता है।
हमने जावा से कोटलिन तक के निर्बाध परिवर्तन पर चर्चा नहीं की, लेकिन ऐसा हुआ।

Korutiny

IntentService का उपयोग करने वाला कोड काम करता है, लेकिन कॉलबैक के साथ कोड की पठनीयता को सुखद नहीं कहा जा सकता है।

काम में कोटलिन के कोरटाइन को देखने की इच्छा जोड़ें। हम इस बात को समझते हैं कि कुछ महीनों के बाद, उत्पन्न चित्रों की उरी फाइलों को वापस करने के लिए जगह की खोज करने की तुलना में आपके तुल्यकालिक कोड को पढ़ना अधिक सुखद होगा।

इसके अलावा, छवि प्रसंस्करण के त्वरण ने विचार को एप्लिकेशन में कई नए स्थानों में, विशेष रूप से अभ्यास के विवरण में, और न केवल प्रशिक्षण के बाद सुविधा का उपयोग करने के लिए प्रेरित किया।

 private val errorHandler = CoroutineExceptionHandler { _, e -> e.printStackTrace()} private val job = SupervisorJob() private val scope = CoroutineScope(Dispatchers.Main + job + errorHandler) private var uries: HashMap<String, Uri?> = HashMap() fun startImageGenerating() = scope.launch { ... val imgMuscle = ImgMuscle() uries = withContext(Dispatchers.IO) { imgMuscle.createMuscleImages() } ... } 

एररहैंडलर, जॉब और स्कोप का स्टैंडर्ड बंडल, कोराउटाइन के टूटने पर एक एरर हैंडलर के साथ स्काउट कोरआउट होता है।

uries - HashMap, जो UI के बाद के आउटपुट के लिए अपने आप में 6 छवियों को संग्रहीत करता है:
uries ["last_back"] = उरी?
uries ["last_front"] = उरी?
uries ["सप्ताह_बैक"] = उरी?
uries ["week_front"] = उरी?
uries ["month_back"] = उरी?
uries ["month_front"] = उरी?

 class ImgMuscle { val lruBitmap: LruCacheBitmap suspend fun createMuscleImages(): HashMap<String, Uri?> { return suspendCoroutine { continuation -> val resultUries = HashMap<String, Uri?>() ... //    continuation.resume(resultUries) } } } 

हम प्रसंस्करण समय को मापते हैं।

 >start 1549400719844 >finish 1549400720440 diff=596 ms 

9313 एमएस से, प्रसंस्करण घटकर 596 एमएस हो गया।

यदि आपके पास अतिरिक्त अनुकूलन के लिए विचार हैं - टिप्पणी करने के लिए स्वतंत्र महसूस करें।