मोबाइल अनुप्रयोगों के लिए Jank — यह क्या है, कारण और समाधान

Jank क्या है

Jank कंप्यूटर ग्राफिक्स का एक शब्द है जो एक दृश्य दोष को दर्शाता है जिसमें एनिमेशन चिकनी गति के बजाय झटके से चलता है। मोबाइल डेवलपमेंट में, Jank को प्रति इकाई समय में छूटे हुए फ्रेम (skipped frames) की संख्या के रूप में मापा जाता है। यदि सिस्टम VSync के समय तक फ्रेम तैयार नहीं कर पाता, तो डिस्प्ले पिछले फ्रेम को दोहराता है — 60 Hz पर 16.6 ms का ठहराव होता है। एक छूटा हुआ फ्रेम ध्यान देने योग्य नहीं हो सकता, लेकिन लगातार 3–5 छूटे हुए फ्रेम 50–80 ms की “रुकावट” की भावना पैदा करते हैं, जिसे उपयोगकर्ता स्पष्ट रूप से महसूस करता है।

Jank उन एनिमेशन के लिए विशेष रूप से महत्वपूर्ण है जिन्हें स्थिर गति से चलना चाहिए: फ़ीड स्क्रॉलिंग, मेनू खोलने का एनिमेशन, पैरालैक्स प्रभाव, स्क्रीन के बीच संक्रमण। Google UX अध्ययन (2024) के अनुसार, जिस ऐप में 3% से अधिक स्क्रॉल सत्रों में Jank दर है, उसे 0.5% से कम दर वाले ऐप की तुलना में 22% अधिक एक-सितारा समीक्षाएँ मिलती हैं। Android Vitals उपकरण स्वचालित रूप से Jank को ट्रैक करता है और इसे गंभीरता के अनुसार वर्गीकृत करता है: मध्यम, गंभीर और अत्यधिक।

Jank के मुख्य कारण

Jank के कारण कई श्रेणियों में विभाजित हैं। पहला — Layout Jank: View के आकार में बदलाव, LayoutTransition एनिमेशन या डायनामिक कंटेंट लोडिंग के कारण बार-बार requestLayout() कॉल से उत्पन्न होता है। प्रत्येक requestLayout कॉल पूरे View उप-वृक्ष के लिए Measure + Layout शुरू करता है, जिसमें 5–30 ms लग सकते हैं। दूसरा — Draw Jank: overdraw और भारी drawable के उपयोग से संबंधित। तीसरा — Thread Jank: सिंक्रोनस संचालन के कारण मुख्य थ्रेड ब्लॉकिंग — फ़ाइल लोडिंग, मुख्य थ्रेड पर डेटाबेस संचालन, Bitmap डिकोडिंग।

चौथी श्रेणी — GC Jank: ART/Dalvik या Swift ARC में कचरा संग्रह (Garbage Collection)। जब हीप में कई ऑब्जेक्ट जमा हो जाते हैं, तो GC 5–15 ms का Stop-The-World ठहराव शुरू करता है। Android पर, GC ठहराव अक्सर लूप में बार-बार आवंटन के दौरान होते हैं: onDraw() में ऑब्जेक्ट बनाना, एडेप्टर में आवंटन, अप्रयुक्त lambda अभिव्यक्तियाँ। पाँचवाँ — IPC Jank: मुख्य थ्रेड पर अंतर-प्रक्रिया संचार (ContentProvider, Binder)। छठा — Rendering Jank: अनुकूलित शेडर या बड़े आकार की बनावट के कारण धीमी GPU रेंडरिंग।

Android में Jank का निदान

Android में, Jank का निदान Perfetto सिस्टम ट्रेस से शुरू होता है। Perfetto सभी थ्रेड, CPU, GPU और शेड्यूलर की गतिविधि रिकॉर्ड करता है। Jank का स्पष्ट संकेतक Choreographer.doFrame और Choreographer.doCallbacks पंक्तियाँ हैं: यदि दो क्रमिक doFrame कॉल के बीच का अंतराल 16.6 ms से अधिक है, तो फ्रेम छूट गया है। Perfetto सटीक कारण दिखाता है — कौन सा system call, lock या GC विलंब का कारण बना। Android Studio Profiler में, CPU Profiler के माध्यम से समान कार्यक्षमता उपलब्ध है।

प्रोडक्शन में स्वचालित Jank पहचान के लिए FrameMetricsAggregator का उपयोग किया जाता है — एक API जो प्रत्येक फ्रेम के लिए आँकड़े एकत्र करता है और उन्हें सत्र के अनुसार एकत्रित करता है। Android 12+ में PerformanceHintManager आया — सिस्टम को लक्ष्य फ्रेम दर के बारे में संकेत देने के लिए एक API। यदि ऐप इंगित करता है कि वह 120 FPS परिदृश्य में चल रहा है, तो सिस्टम Jank को रोकने के लिए CPU/GPU आवृत्ति बढ़ा सकता है। सभी छूटे हुए फ्रेम की सरल लॉगिंग के लिए, Choreographer.FrameCallback की सदस्यता लेना पर्याप्त है।

Choreographer के माध्यम से Jank लॉगिंग

Kotlin कोड Choreographer.FrameCallback की सदस्यता लेता है और विलंब अवधि के साथ प्रत्येक छूटे हुए फ्रेम को लॉग करता है। कॉलबैक प्रत्येक VSync पर लागू होता है।

class JankDetector {

    private val frameBudget = 16_666_666L
    private var previousFrameTime = 0L

    private val callback =
        Choreographer.FrameCallback { currentTime ->
            if (previousFrameTime != 0L) {
                val frameDuration =
                    currentTime - previousFrameTime
                val skippedFrames =
                    (frameDuration / frameBudget) - 1
                if (skippedFrames > 0) {
                    Log.w("Jank",
                        "Skipped $skippedFrames frames")
                }
            }
            previousFrameTime = currentTime
            Choreographer.getInstance()
                .postFrameCallback(this)
        }

    fun start() {
        Choreographer.getInstance()
            .postFrameCallback(callback)
    }
}

iOS में Jank का निदान

iOS में, Jank का निदान Core Animation टेम्पलेट के साथ Instruments के माध्यम से किया जाता है। Instruments वास्तविक समय में FPS, ऑफस्क्रीन रेंडर की संख्या और हिट परीक्षण दिखाता है। iOS में Jank के मुख्य संकेतक: Core Animation टाइमलाइन पर लाल बार (फ्रेम बजट से अधिक), उच्च Renderer मान (ऑफस्क्रीन रेंडरिंग का संकेत) और कम FPS। प्रोडक्शन निगरानी के लिए, MetricKit MXAnimatoryMetric मीट्रिक के साथ रिपोर्ट एकत्र करता है, जिसमें औसत FPS, P50 और P95 फ्रेम समय शामिल है।

iOS में मूल Jank निदान में टाइमस्टैम्प और targetTimestamp जाँच के साथ CADisplayLink शामिल है। यदि वर्तमान टाइमस्टैम्प targetTimestamp से काफी पीछे है, तो एक या अधिक फ्रेम छूट गए हैं। Apple कस्टम प्रोफाइलिंग के लिए os_signpost का उपयोग करने की भी सिफारिश करता है: फ्रेम रेंडरिंग की शुरुआत और अंत में signpost-interval रखें और Instruments में देखें कि कौन से अंतराल 16.6 ms से अधिक हैं। SwiftUI में, Jank निदान के लिए UIView.invalidateIntrinsicContentSize का उपयोग किया जाता है — इस विधि का बार-बार कॉल अस्थिर Layout का संकेत देता है।

CADisplayLink Jank पहचान के लिए

Swift कोड CADisplayLink के माध्यम से छूटे हुए फ्रेम का पता लगाता है। यदि टाइमस्टैम्प और targetTimestamp के बीच का अंतर 16.6 ms से अधिक है, तो Jank दर्ज किया जाता है।

class JankMonitor {

    private var displayLink: CADisplayLink?
    private var totalJank = 0

    func start() {
        displayLink = CADisplayLink(
            target: self,
            selector: #selector(detectJank)
        )
        displayLink?.add(to: .current,
            forMode: .common)
    }

    @objc
    private func detectJank() {
        guard let link = displayLink else { return }
        let delay = link.targetTimestamp
            - link.timestamp
        if delay > 0.0167 {
            totalJank += 1
        }
    }
}

Jank प्रोफाइलिंग उपकरण

Jank प्रोफाइलिंग के लिए, अंतर्निहित OS उपकरण और तृतीय-पक्ष SDK दोनों का उपयोग किया जाता है। Android पर, मुख्य उपकरण Perfetto है (जिसने Systrace को बदल दिया)। Perfetto 30 सेकंड तक के ट्रेस रिकॉर्ड कर सकता है और वेब इंटरफ़ेस ui.perfetto.dev के माध्यम से उनका विश्लेषण कर सकता है। यह Choreographer गतिविधि, रेंडरिंग थ्रेड (RenderThread) और GPU के साथ एक सटीक टाइमलाइन दिखाता है। GPU समस्याओं के विस्तृत विश्लेषण के लिए, AGI (Android GPU Inspector) का उपयोग किया जाता है, जो न केवल फ्रेम समय बल्कि विशिष्ट GPU ब्लॉक — शेडर, रैस्टराइज़र, टेक्सचर यूनिट — पर लोड भी दिखाता है।

iOS पर, समकक्ष Core Animation, Metal System Trace और GPU Driver टेम्पलेट के साथ Instruments है। Core Animation FPS और फ्रेम समय दिखाता है, Metal System Trace प्रत्येक draw call तक GPU कार्य दिखाता है। लोड के तहत वास्तविक उपकरणों पर प्रोफाइलिंग के लिए, Firebase Performance (Screen Rendering मीट्रिक एकत्र करता है) और Sentry (Jank पर stack trace कैप्चर करता है) का उपयोग किया जाता है। नया Android 15 Performance Hint API डेवलपर को सिस्टम को बताने की अनुमति देता है कि कौन से फ्रेम महत्वपूर्ण हैं और Jank निकट आने पर सिस्टम से चेतावनी प्राप्त करता है।

प्रोडक्शन में FrameMetricsAggregator

Kotlin कोड एक सत्र में फ्रेम आँकड़े एकत्र करने के लिए FrameMetricsAggregator का उपयोग करता है। एग्रीगेटर को रोकने के बाद, छूटे हुए फ्रेम की संख्या प्रदर्शित होती है।

class JankAggregator(private val activity: Activity) {

    private val aggregator = FrameMetricsAggregator()

    fun startCollection() {
        aggregator.add(activity.window)
    }

    fun stopAndReport() {
        aggregator.remove()
        val result = aggregator.getMetrics()
        val totalFrames = result
            ?.get(FrameMetrics.TOTAL_DURATION)
            ?.size ?: 0
        val jankFrames = result
            ?.get(FrameMetrics.TOTAL_DURATION)
            ?.count { it > 16_666_666L} ?: 0
        Log.d("JankReport",
            "Jank ratio: \${jankFrames * 100 / totalFrames}%")
    }
}

फ्रेम रुकावट दूर करने के तरीके

Jank को खत्म करने के लिए इसके प्रकार के आधार पर तकनीकों के संयोजन की आवश्यकता होती है। Layout Jank के लिए: गहरी पदानुक्रम को ConstraintLayout/Compose/SwiftUI से बदलें, merge टैग का उपयोग करें, एनिमेशन में requestLayout से बचें। Draw Jank के लिए: 4x+ overdraw खोजने के लिए Debug GPU Overdraw का उपयोग करें, भारी drawable को वेक्टर ग्राफिक्स (VectorDrawable/PDF) से बदलें, hardware layers का सावधानी से उपयोग करें — वे रेंडरिंग को गति देते हैं लेकिन अधिक GPU मेमोरी खपत करते हैं। Thread Jank के लिए: सभी I/O संचालन, डेटाबेस कार्य और Bitmap डिकोडिंग को पृष्ठभूमि थ्रेड में ले जाएँ, सही Dispatcher के साथ Kotlin Coroutines या Schedulers.io() के साथ RxJava का उपयोग करें।

GC Jank के लिए: onDraw() और getView() में आवंटन कम करें, ऑब्जेक्ट पूल (ObjectPool) का उपयोग करें, for-each को इंडेक्स्ड for से बदलें, Kotlin में copy() के साथ immutable data class का सावधानी से उपयोग करें — copy एक नया ऑब्जेक्ट बनाता है। IPC Jank के लिए: App Startup के माध्यम से ContentProvider को आलसी तरीके से प्रारंभ करें, Binder कॉल को पृष्ठभूमि थ्रेड में ले जाएँ। Rendering Jank के लिए: बनावट का आकार अधिकतम स्क्रीन रिज़ॉल्यूशन तक कम करें, ASTC या ETC2 संपीड़न का उपयोग करें, अत्यधिक शेडर संकलन से बचें (शेडर पहले से संकलित करें)। एक व्यापक समाधान CI में नियमित Perfetto/Instruments प्रोफाइलिंग और Jank प्रतिगमन को ट्रैक करना है।

Anti-Jank पैटर्न: Async Layout

Kotlin कोड reportFullyDrawn के बाद स्क्रीन पर डेटा की अतुल्यकालिक लोडिंग प्रदर्शित करता है, ताकि भारी कार्य पहले फ्रेम को ब्लॉक न करे। कॉलबैक उपयोगकर्ता द्वारा इंटरफ़ेस देखने के बाद लागू होता है।

class JankSafeLoader {

    suspend fun loadAfterFirstFrame(
        activity: Activity
    ) {
        // गारंटी है कि पहला फ्रेम पहले ही रेंडर हो चुका है
        if (Build.VERSION.SDK_INT >= 29) {
            activity.reportFullyDrawn()
        }

        // भारी लोडिंग — पहले फ्रेम के बाद
        withContext(Dispatchers.IO) {
            val data = fetchHeavyData()
            withContext(Dispatchers.Main) {
                updateUI(data)
            }
        }
    }
}