drawWithCache e prestazioni
Eviti di ricreare gli oggetti di disegno a ogni frame.
drawWithCache e prestazioni è una lezione Jetpack Compose Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Jetpack Compose Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Jetpack Compose Academy include 4 lezioni in totale.
Parti di questa lezione non sono ancora state tradotte e vengono mostrate in inglese.
Drawing Runs Often
Your Canvas lambda can run on every frame. Rebuilding heavy objects there, frame after frame, quietly drags down performance.
The Costly Objects
Things like Path, Brush, and Paint are not free to create. Allocating them on each draw wastes work the GPU never needed.
Enter drawWithCache
The drawWithCache modifier lets you build expensive objects once and reuse them. It splits setup from the actual drawing step.
Modifier.drawWithCache {
// build once here
onDrawBehind { /* draw each frame */ }
}Build Block Runs Rarely
Code in the cache block only re-runs when the size or your read state changes. Put your Path and Brush creation right here.
Modifier.drawWithCache {
val brush = Brush.linearGradient(colors)
onDrawBehind { drawRect(brush) }
}onDrawBehind
Use onDrawBehind to paint underneath the Composable's content. It gives you a DrawScope that runs on each frame, cheaply.
onDrawBehind {
drawCircle(color = Color.Blue)
}onDrawWithContent
Need to mix your art with the actual UI? onDrawWithContent lets you draw, call drawContent, and draw again around it.
onDrawWithContent {
drawContent()
drawRect(color = Color.Black, alpha = 0.2f)
}Cache the Path
A chart Path is a classic win. Build it once in the cache block, then just drawPath it every frame without rebuilding.
val path = Path().apply { /* shape */ }
onDrawBehind { drawPath(path, Color.Green) }React to Size
Inside the cache block you can read size safely. When the canvas resizes, your block re-runs and rebuilds objects to fit.
Avoid State Reads in Draw
Reading state during drawing can trigger extra work. Keep your draw block lean and move setup into the cache block instead.
Measure, Do Not Guess
Before optimizing, profile. The Layout Inspector and frame timings tell you what really stutters, so you fix the right thing.
Reuse Wherever You Can
The golden rule: build heavy objects once and reuse them. drawWithCache makes that pattern easy and your animations buttery smooth.
Quick Check
Where should you create an expensive Brush so it is not rebuilt every frame?
Recap
You learned to keep drawing fast: build heavy objects in the drawWithCache block, draw cheaply in onDrawBehind, and always measure first. Smooth frames! ⚡
Domande Frequenti
La lezione «drawWithCache e prestazioni» è gratuita?
Sì — il testo completo di «drawWithCache e prestazioni» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Jetpack Compose Academy, passa a CoddyKit PRO. Il corso Jetpack Compose Academy include 4 lezioni in totale.
Cosa imparerò in «drawWithCache e prestazioni»?
Eviti di ricreare gli oggetti di disegno a ogni frame. Eserciti Jetpack Compose Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Jetpack Compose Academy?
Non è richiesta alcuna esperienza precedente. Jetpack Compose Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.
Quanto tempo richiede la lezione «drawWithCache e prestazioni»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Jetpack Compose Academy?
Sì. Ogni lezione Jetpack Compose Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- DrawScope: linee, rettangoli e cerchi
- Percorsi, gradienti e modalità di fusione
- drawWithCache e prestazioni
- Creare un anello di avanzamento live