गॉट्टा गो फास्ट: आईओएस में स्पीड फॉर बिल्डिंग। भाग २

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

यह 2017 में इंटरनेशनल मोबाइल डेवलपर्स कॉन्फ्रेंस MBLT DEV में RayWenderlich.com पर iOS के विकास के लिए एक iOS इंजीनियर, ल्यूक परम द्वारा दिए गए मुख्य भाषण पर आधारित लेख और RayWenderlich.com पर iOS के विकास के लिए ट्यूटोरियल के लेखक का दूसरा भाग है।

कोर एनीमेशन साधन

यदि आपने बहुत अधिक प्रोफाइलिंग की है और आपको अपनी सारी अड़चनें मिल गई हैं, तो कभी-कभी प्रदर्शन की समस्याएं भी होती हैं। ऐसा इसलिए है क्योंकि iOS में UI सामान काम करता है। जब भी आप फ्रेम सेट करते हैं या यूआईवीवाई बनाते हैं, तो वास्तव में हुड के नीचे क्या होता है क्या आप कैटरेन्स बनाते हैं या सिस्टम इसे आपके लिए बनाता है। और ये "रेंडर सर्वर" नामक चीज़ के लिए भेज दिए जाते हैं। रेंडरिंग सर्वर एनिमेशन करने के लिए प्रभारी है। यदि आप एक UIView चेतन करते हैं: जो कुछ भी, वह सब रेंडर सर्वर पर होगा जो एक और धागा है और यह ऐप के सभी एनिमेशन को हैंडल करता है।



यहां एक टाइम प्रोफाइलर है, जिसमें सबसे ऊपर एक फ्रेम दर गेज है। और सबसे निचले हिस्से में डिबग विकल्प है। हम दो सबसे महत्वपूर्ण और आसान चीजों को ठीक करने के बारे में बताने जा रहे हैं।



पहले एक रंग मिश्रित परतें हैं। यह ठीक करने के लिए एक बहुत आसान है। और यह हमें प्रदर्शन पुलिस के पहले खंड में लाता है। मूल रूप से, बहुत सारे ऐप में समस्याएं हैं: यहां तक ​​कि iMessage, प्रिय ऐप्पल ऐप, वास्तव में बहुत बढ़िया सामान नहीं कर रहा है। यहाँ हम देखते हैं कि लाल रंग का एक बहुत कुछ है:



लाल का मतलब है कि आपके पास एक लेबल है जिसमें एक सफेद पृष्ठभूमि है। और फिर वे एक अन्य सफेद पृष्ठभूमि के शीर्ष पर हैं और किसी कारण से, वे अपारदर्शी होने के लिए सेट नहीं हैं। तो ब्लेंडर इन रंगों को मिश्रित कर रहा है, सफेद और सफेद और परिणामस्वरूप सफेद रंग प्राप्त कर रहा है। लाल रंग के प्रत्येक पिक्सेल के लिए यह बिना किसी लाभ के अतिरिक्त गणना कर रहा है, फिर भी आप पृष्ठभूमि में सफेद हो जाते हैं।

इससे बचने के लिए जब भी संभव हो आप लेप अपारदर्शी बना सकते हैं यदि वे एक ही रंग पर एक ही रंग के हों। यदि सबव्यू में एक ही पृष्ठभूमि का रंग सम्मिश्रण अनावश्यक है। आपको बस अपनी लेयर अपारदर्शिता को 1 पर सेट करना है और फिर सुनिश्चित करें कि बैकग्राउंड कलर सेट है। यदि आपकी पृष्ठभूमि का रंग स्पष्ट है, तो यह हमेशा अपारदर्शी नहीं होगी।

ऑफस्क्रीन प्रतिपादन

यदि आप इस विकल्प को चालू करते हैं तो ऑफ़स्क्रीन रेंडर किए गए तत्व पीले रंग में दिखाए जाएंगे। कोर एनिमेशन इंस्ट्रूमेंट की अच्छी बात यह है कि आप अन्य ऐप देख सकते हैं। आप इन विकल्पों को चालू कर सकते हैं और फिर अपने सिस्टम के किसी भी ऐप पर जा सकते हैं और आप देख सकते हैं कि वे क्या गलत कर रहे हैं। इस मामले में, इंस्टाग्राम के पास ये छोटे बुलबुले हैं जो आपको लोगों की कहानियां दिखाते हैं।



जैसा कि आप देख सकते हैं कि वे सभी पीले हैं। IPhone 5 पर वे आक्रामक रूप से धीमा हैं। और इसका कारण यह है कि ऑफ-स्क्रीन रेंडर अल्फा ब्लेंडिंग की तुलना में बहुत खराब है। यह GPU को स्टाल करता है। यह GPU और CPU के बीच आगे और पीछे अतिरिक्त गणना करने के लिए समाप्त होता है, इसलिए आपको अतिरिक्त स्टॉल मिलते हैं जो कि अधिकांश समय अनावश्यक होते हैं।

कॉर्नरिंग के बजाय बेजियर पथ

अगला नियम: कोने की त्रिज्या संपत्ति का उपयोग न करें। यदि आपके पास एक दृश्य है और आप view.layer.cornerRadius को सेट करते हैं, तो यह हमेशा ऑफ-स्क्रीन रेंडरिंग पेश कर रहा है। इसके बजाय, आप पहले से एक बीज़ियर पथ और उसी तरह के CGBitmap सामान का उपयोग कर सकते हैं। इस मामले में, एक UIGraphics संदर्भ। यह फ़ंक्शन UIImage के साथ संचालित होता है जो एक आकार में होता है, उस आकार के आधार पर गोल कोनों को करता है और क्लिप करने के लिए एक बेजियर पथ का उपयोग करता है। फिर हम छवि को क्लिप करते हैं और इसे UIImage संदर्भ से वापस करते हैं। तो यह उस दृश्य को गोल करने के बजाय एक पूर्व-गोल छवि को लौटाएगा जो छवि अंदर बैठती है।



आखिरी उदाहरण। यहां ट्विटर है और यह इस एनीमेशन का वास्तविक समय चल रहा है। इसे खोलने और आपको जानकारी दिखाने के लिए माना जाता है, लेकिन इस पाठ और सामग्री को ऑफ-स्क्रीन प्रदान किया गया है, इसलिए इसने एनीमेशन को एक क्रॉल तक धीमा कर दिया है। यह सबसे कम प्रदर्शन वाली चीज़ है जो मैंने कभी किसी ऐप स्टोर पर पाई है।



तो यह कैसे हुआ? एक चीज जो ऐसा करने का कारण बनती है वह है एक CALayer की सम्पत्ति को जुटाना। यह एक परत पर एक विकल्प है जो आपको बनावट को कैश करने की अनुमति देता है जिसे प्रदान किया गया है। बहुत सारे अजीब नियम हैं। जैसे अगर इसे एक निश्चित मात्रा में मिलीसेकंड में इस्तेमाल नहीं किया गया है, तो यह कैश छोड़ देगा। और फिर, अगर यह कैश छोड़ देता है, तो यह हर फ्रेम पर ऑफ-स्क्रीन प्रदान किया जाएगा। यह वास्तव में इसके संभावित लाभों के लायक नहीं है। और यह जांचना मुश्किल है कि क्या यह वास्तव में आपको फायदा पहुंचा रहा है।

सारांश

यदि संभव हो तो ऑफ-स्क्रीन रेंडरिंग और अल्फा सम्मिश्रण से बचें। अल्फा सम्मिश्रण कभी-कभी आवश्यक होता है। यह ऑफ-स्क्रीन रेंडरिंग से बेहतर है। ऑफ-स्क्रीन रेंडरिंग कुछ कारणों से होता है। यह छाया से हो सकता है; यह कोने की गोलाई से हो सकता है; यह मास्किंग से हो सकता है।

जब संभव हो तो विचार अपारदर्शी बनाएं। कॉर्नर त्रिज्या संपत्ति का उपयोग न करें बेज़ियर पथ का उपयोग करें जितना आप कर सकते हैं। इसके अलावा, यदि आप पाठ छाया कर रहे हैं, तो लेयर शैडो गुणों का उपयोग न करें। आप इसके बजाय NSShadow का उपयोग कर सकते हैं।

गतिविधि का पता लगाना

एक्टिविटी ट्रेस एक तरह का बहुत निचले स्तर का संस्करण है जो कि समय-समय पर होता है। यह आपको आपके सभी थ्रेड्स और वे कैसे इंटरैक्ट कर रहे हैं, का एक दृश्य देता है। और यह बहुत जटिल है। लेकिन इसमें बहुत अच्छी विशेषताएं हैं जिन्हें आप सेट कर सकते हैं।

सिस्टम ट्रेस

विशिष्ट घटनाओं के लिए समय ट्रैक करने के लिए सिस्टम ट्रेस का उपयोग करें। आप विशिष्ट घटनाओं और कोड के वर्गों को ट्रैक करने के तरीके सेट कर सकते हैं और देख सकते हैं कि वे वास्तविक दुनिया में कितने समय के लिए आवेदन कर रहे हैं। यह आपके सिस्टम में क्या हो रहा है, इसके बारे में आपको बारीक जानकारी प्राप्त करने की अनुमति देता है।

• जब कुछ महत्वपूर्ण होता है तो संकेत देने के लिए "साइन पोस्ट" का उपयोग करें।
• जब आप एक एनीमेशन घटित होना चाहते हैं या ऐसा कुछ देखना चाहते हैं, तो अंक एकल घटनाएँ हैं।
• क्षेत्रों में एक शुरुआत और एक अंत है। छवि डिकोडिंग के लिए, आप देख सकते हैं कि यह कब शुरू होता है और कब समाप्त होता है इसलिए आप अनुमान लगा सकते हैं कि इसे सामान्य रूप से कितना समय लगा।

यहां बताया गया है कि आपने सिस्टम ट्रेस टेम्पलेट कैसे सेट किया है। आप उन घटनाओं की सूची बनाते हैं जो हो सकती हैं। तो नंबर एक एक छवि डाउनलोड है। दो एक छवि डिकोडिंग है, और तीन यह झुकाव एनीमेशन मैंने जोड़ा है। मूल रूप से, आप यह देखने के लिए कुछ अतिरिक्त विकल्प निर्धारित करते हैं कि रंग क्या होने जा रहे हैं। मूल रूप से, आप इसे 1 या 2 की तरह एक नंबर भेजते हैं, यह आपके द्वारा वहां भेजे जाने के आधार पर लाल या हरा होगा।



यदि आप Objective-C में हैं, तो आपको इस kdebug_signpost हैडर को आयात करना होगा। स्विफ्ट में, यह आपके लिए उपलब्ध है।



और फिर आपको इस फ़ंक्शन को या तो kdebug_signpost या kdebug_signpost_start और kdebug_ signpost_end पर कॉल करना होगा। और वे आपके द्वारा पास किए गए कोड को बंद कर देते हैं। तो हमने उन संख्याओं के साथ उन तीन घटनाओं को स्थापित किया। फिर आप यहां उस नंबर पर जाएं। आप इसे एक ऑब्जेक्ट पास करते हैं जो मूल रूप से इस घटना के लिए महत्वपूर्ण है। और फिर, अंतिम संख्या रंग है। तो 2 ऐसा है जैसे आप लाल या कुछ और जानते हैं।

GitHub पर मेरा एक स्विफ्ट उदाहरण प्रोजेक्ट है । मैं सरलीकृत चीजों की तरह। एक शुरुआत और अंत होता है, जिससे निपटना थोड़ा आसान होता है।

एक बार ट्रेस करने के बाद यह ऐसा दिखेगा। यह आपको पहले कुछ भी नहीं दिखाएगा। फिर, जब आप ऐप को मारेंगे, तो यह कुछ गणना करेगा और आपको यहां सामान दिखाएगा।



यहां हम अपनी छवि डाउनलोड देख सकते हैं जो लगभग 200 मिलीसेकंड की है। और फिर, छवि डिकोडिंग है जो 40 मिलीसेकंड की तरह लगी। यह वास्तव में अच्छा है यदि आपके पास अपने ऐप में पागल सामान का एक गुच्छा है। आप इन सभी घटनाओं को सेट कर सकते हैं और फिर बस देख सकते हैं कि वे कितनी देर तक प्रत्येक को ले रहे हैं और एक दूसरे के साथ कैसे बातचीत कर रहे हैं। यह सिस्टम ट्रेस के लिए है।

बोनस

कैमरा मंदी के उदाहरण पर एक नज़र डालें जहाँ हम देख सकते हैं कि अगर ऐप में AR चीजें हैं तो क्या होता है:



हमने एक प्रभाव लागू किया और यह केवल एक प्रभाव की गणना करने के लिए हर फ्रेम पर सभी गणनाओं का 26.4% ले रहा था। और यह 10 फ्रेम प्रति सेकंड की तरह पागल कुछ करने के लिए कैमरा धीमा कर रहा था।

जब मैंने यहां खोदा और इस बड़ी अड़चन को देखा, तो मैंने देखा कि सबसे ज्यादा काम जो सबसे ज्यादा काम कर रहा था, वह था गहन एनएसडीस्पाचडटा का उपयोग।



यह NSData का एक उपवर्ग है। और यह सब है यह रेंज फ़ंक्शन के साथ बाइट्स प्राप्त करें। और यह एक सरल कार्य है। यह सब यह है कि यह एक डेटा से कुछ बाइट्स लेता है और इसे कहीं और डालता है। यह बहुत पागल नहीं है, लेकिन जाहिर है, आंतरिक रूप से सभी चीजें जो इस 26% का 18% हिस्सा ले रही थीं।

नियम # 1

यह एक NSData है और यह बाइट्स प्राप्त कर रहा है। यह एक साधारण उद्देश्य-सी चीज है लेकिन अगर आप इसमें भाग लेते हैं और यह एक अड़चन है, तो यह समय है बजाय सी का उपयोग करने के लिए स्विच करने का। चूंकि फ्लोट वैल्यू को हथियाने के लिए अड़चन एक कॉल के आसपास थी, आप सिर्फ मेम्ची () का उपयोग कर सकते हैं। मेमसीपी () के साथ आप डेटा का एक हिस्सा कहीं और स्थानांतरित कर सकते हैं। बहुत अधिक उपरि काटता है।

यदि आप NSData की तरह देखते हैं, तो ये कक्षाएं हजारों लाइनों की तरह हैं। इसलिए वहां बहुत सारा सामान चल रहा है। इस मामले में, हमारे पास लाल रंग में मूल है।



यहां आपको एक सीमा मिलती है, कुछ बाइट्स को पकड़ो और उन्हें बफर में कॉपी करें। Memcpy () संस्करण लगभग एक ही बात है। यह किसी भी अधिक जटिल नहीं दिखता है और यह आक्रामक रूप से कम चीजें करता है।



जब हम इसे बदल देते हैं और हम इसे फिर से चलाते हैं, तो चीजों को 26% से 0.6% तक बदल दिया जाता है। और फिर, फ्रेम दर में नाटकीय रूप से वृद्धि हुई।

नियम # २

अगर आप किसी तरह का रेंडरिंग ऐप कर रहे हैं या फिर आप लोडिंग बार की तरह कुछ कर रहे हैं, तो भी ओवरराइडिंग से बचें। बहुत बार होने वाली घटनाएं 60 फ्रेम प्रति सेकंड से अधिक होंगी। उस स्थिति में, आप CADisplayLink का उपयोग करके UI के इस अपडेट को थ्रॉटल कर सकते हैं। इसके पास एक संपत्ति है, जिसे पसंदीदाफ्रीपर्ससेकंड कहा जाता है। यह केवल iOS 10 या इससे अधिक के लिए है। पुराने लोगों के लिए, आपको इसे मैन्युअल रूप से करना होगा लेकिन यह अभी भी उपयोगी है।



आप वांछित फ्रैमरेट सेट कर सकते हैं। लोडिंग बार की तरह बहुत बार मैं इसे प्रति सेकंड लगभग 15 फ्रेम सेट करूंगा क्योंकि यह वास्तव में मायने नहीं रखता है। इसमें 60 फ्रेम प्रति सेकंड अपडेट नहीं करना है। यह आपको बहुत काम बचा सकता है जो वास्तव में आप करते हैं यदि चीजें उसी तरह दिखती हैं।

नियम # ३

छोटा सा कैशिंग का प्रयोग करें। यह केवल उद्देश्य-सी के लिए उपयोगी है। InObjective-C, जब आप हुड के तहत एक विधि कहते हैं, तो आप वास्तव में Objective-C संदेश भेजने के कार्य (objc_msgSend ()) को बुला रहे हैं। यदि आप इस कॉल को समय का एक बड़ा हिस्सा ले रहे निशान में देख रहे हैं, तो यह कुछ ऐसा है जिसे आप वास्तव में आसानी से छुटकारा पा सकते हैं। यह मूल रूप से कैश टेबल है जहां आप इसे किसी विधि का नाम देकर फ़ंक्शन पॉइंटर्स देखते हैं। हर बार उस लुकअप को करने के बजाय आप फ़ंक्शन पॉइंटर को कैश कर सकते हैं और सीधे कॉल कर सकते हैं। यह आम तौर पर कम से कम दोगुना होता है।



यदि आपके पास कैश्ड पॉइंटर नहीं है, तो आप इसे मेथड सेलेक्ट कर सकते हैं। तब हम इस विधि को एक नियमित फ़ंक्शन कॉल की तरह कहते हैं। आप ऑब्जेक्ट में चयनकर्ता को पास करते हैं और उसके बाद कोई भी तर्क आते हैं।

नियम # 4

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

अपने साथियों को ऐसा करने के लिए सहमत होना और इसके बारे में पागल नहीं होना भी मुश्किल है।

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

अगर आपको लगता है कि यदि आप इसे दिलचस्प समझते हैं, तो सामान में देख रहे हैं, मार्सेल वेहेर द्वारा "आईओएस और मैकओएस: परफॉर्मेंस ट्यूनिंग" नामक एक बहुत अच्छी किताब है। यह वास्तव में गहराई में इस सामान का एक बहुत कुछ है और यह बहुत अधिक अतीत में चला जाता है। मेरे पास एक वीडियो श्रृंखला भी है। मैं RayWenderlich के लिए वीडियो करता हूं। एक व्यावहारिक उपकरण श्रृंखला है जो मैंने की थी जो अधिक गहराई तक जाती है और जो इन चीजों को थोड़ा और अधिक समझाती है और इसके कुछ उदाहरण हैं। इसलिए यदि आप विशेष रूप से उपकरणों के बारे में अधिक जानना चाहते हैं, तो आप उस वीडियो श्रृंखला को देख सकते हैं। और फिर, WWDC वीडियो - उनमें से एक टन है जो विभिन्न प्रदर्शन चीजों को इस तरह समझाता है।

वीडियो

यहां आप ल्यूक की बात पर आधारित एक लेख का पहला भाग पा सकते हैं। पूरी बात यहां देखें: