Question

What makes scrolling so choppy on the UITableView when images are loaded? Is it because they need to be added as subviews? Or is it because images need to be cached? Both?

Answer 1

Because they’re added as subviews, and it’s a lot of work to draw subviews as they have to be composited. Even more so when Core Graphics or Core Animation is drawing multiple cells with these subviews.

Loren Brichter (atebits) explains it better:

Much like on Mac OS X, there are two drawing systems on the iPhone. One is CoreGraphics, the other is LayerKit CoreAnimation. CoreGraphics does drawing on the CPU, CoreAnimation does drawing on whatever it thinks is fastest – most likely the GPU.

The GPU on the iPhone hates blending, that’s why Apple recommends that you keep as many of your views opaque as possible. Sometimes you have no choice – if you have a label over an image you are forced to make the label transparent otherwise you get a big ugly block around your text.

What’s a developer to do? Pre-blend of course… with CoreGraphics into your own view. If you blend your stuff together into a single static view on demand (e.g. when a table view moves a cell onscreen), it’s a little bit more expensive for the first frame, but every frame after that CoreAnimation is just dealing with one big, opaque texture… which it loves. It’s more than just the blending too. If you think about what is happening in terms of overdraw, having one big view per table cell is a big win because CoreAnimation will only touch a single given pixel on the screen once rather than multiple times (potentially, depending on how much overlap your old view hierarchy had).