Tweet
Tweet

Slide 1

Slide 1 text

Silky Smooth Tricks for measuring and improving scroll performance Part 1

Slide 2

Slide 2 text

Measure & Analyse

Slide 3

Slide 3 text

2 common symptoms

Slide 4

Slide 4 text

1. Low, but consistent frame rates

Slide 5

Slide 5 text

can be caused by... •excessive compositing •layer blending •pixel misalignment

Slide 6

Slide 6 text

Blended Layers

Slide 7

Slide 7 text

Misaligned Images

Slide 8

Slide 8 text

Offscreen Rendering

Slide 9

Slide 9 text

2. Stuttering frame rate when new cells come on screen

Slide 10

Slide 10 text

can be caused by... •expensive cell creation •complex cell layout •loading/scaling images

Slide 11

Slide 11 text

When you try and fix these things...

Slide 12

Slide 12 text

...change one thing at a time

Slide 13

Slide 13 text

...and compare Apples with Apples

Slide 14

Slide 14 text

I’ll let you in on a little secret...

Slide 15

Slide 15 text

UIAutomation isn’t just for testing

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

Close your eyes!

Slide 19

Slide 19 text

var target = UIATarget.localTarget(); target.delay(10); target.flickFromTo({x:160, y:460},{x:160, y:160}); target.delay(4); target.flickFromTo({x:160, y:460},{x:160, y:160}); target.delay(4); target.flickFromTo({x:160, y:160},{x:160, y:460}); target.delay(4); target.flickFromTo({x:160, y:460},{x:160, y:160}); target.delay(4); target.flickFromTo({x:160, y:160},{x:160, y:460}); target.delay(4); target.flickFromTo({x:160, y:460},{x:160, y:160}); target.delay(4); target.flickFromTo({x:160, y:160},{x:160, y:460}); target.delay(4); target.flickFromTo({x:160, y:460},{x:160, y:160}); target.delay(4);

Slide 20

Slide 20 text

Test on multiple devices

Slide 21

Slide 21 text

Some are CPU constrained iPhone 3GS

Slide 22

Slide 22 text

iPhone 4 Some are GPU constrained

Slide 23

Slide 23 text

Some are CPU & GPU constrained 4th Gen iPod Touch

Slide 24

Slide 24 text

2% 78% 20% iPhone 4 iPhone 4s & 5 iPhone 3 & 3GS Choose a minimum hardware spec to optimise for based on your userbase:

Slide 25

Slide 25 text

We consider iPhone 4 our low-end target

Slide 26

Slide 26 text

Remember

Slide 27

Slide 27 text

1. Don't prematurely optimise!

Slide 28

Slide 28 text

2. Each app is different.

Slide 29

Slide 29 text

Part 2 will look at optimisations and their effect.

Slide 30

Slide 30 text

Homework

Slide 31

Slide 31 text

2011 •121 “Understanding UIKit Rendering” •129 “Practical Drawing for iOS Developers” 2012 •240 “Polishing Your Interface Rotations” WWDC videos

Slide 32

Slide 32 text

References Designing for iOS: Graphics & Performance http://goo.gl/xDFtF Tips for improving performance of your iOS application http://goo.gl/X5q4F Customizing UITableViewCells: a better way. http://goo.gl/FNymk

Slide 33

Slide 33 text

References Mac QuartzGL (2D drawing on the graphics card) performance http://goo.gl/ks4Mb iOS vs. Android ICS: Hardware Accelerated Graphics Pipelines http://goo.gl/4zMb9 View Programming Guide for iOS: View and Window Architecture http://goo.gl/zJifp

Slide 34

Slide 34 text

References Simple Strategies for Smooth Animation on the iPhone http://goo.gl/4NwGR

Slide 35

Slide 35 text

Tools ImageOptim http://imageoptim.com/ ImageOptim optimizes images — so they take up less disk space and load faster — by finding best compression parameters and by removing unnecessary comments and color profiles. It handles PNG, JPEG and GIF animations.

Slide 36

Slide 36 text

[email protected] seanwoodhouse