Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Responsive UI for iOS Apps

Responsive UI for iOS Apps

How to build fast and responsive UI for you application.

Vitalii Topoliuk

June 27, 2014
Tweet

More Decks by Vitalii Topoliuk

Other Decks in Programming

Transcript

  1. CPU bound vs GPU bound • Creating views • Layout

    views • CGContext drawing • Image decoding
  2. CPU bound vs GPU bound • Creating views • Layout

    views • CGContext drawing • Image decoding • Offscreen rendering • Count of views/layers • Shapes/Shadow/Effects
  3. • Drops over 50ms f.e. • Usually when new cell

    appears • Can be easily tracked with CADisplayLink Collecting data
  4. Tips & Tricks • Preloading next rows • Simple views/layers

    hierarchy (backboardd!!!) • view.hidden vs add/removeFromSuperview: • Using CALayer instead of UIView • Image decoding in background • Caching layers (only x2.5 screen sizes!)
  5. Tips & Tricks • Preloading next rows • Simple views/layers

    hierarchy (backboardd!!!) • view.hidden vs add/removeFromSuperview: • Using CALayer instead of UIView • Image decoding in background • Caching layers (only x2.5 screen sizes!)
  6. Tips & Tricks • Preloading next rows • Simple views/layers

    hierarchy (backboardd!!!) • view.hidden vs add/removeFromSuperview: • Using CALayer instead of UIView • Image decoding in background • Caching layers (only x2.5 screen sizes!)
  7. Tips & Tricks • Preloading next rows • Simple views/layers

    hierarchy (backboardd!!!) • view.hidden vs add/removeFromSuperview: • Using CALayer instead of UIView • Image decoding in background • Caching layers (only x2.5 screen sizes!)
  8. Tips & Tricks • Preloading next rows • Simple views/layers

    hierarchy (backboardd!!!) • view.hidden vs add/removeFromSuperview: • Using CALayer instead of UIView • Image decoding in background • Caching layers (only x2.5 screen sizes!)
  9. Tips & Tricks • Preloading next rows • Simple views/layers

    hierarchy (backboardd!!!) • view.hidden vs add/removeFromSuperview: • Using CALayer instead of UIView • Image decoding in background • Caching layers (only x2.5 screen sizes!)
  10. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images where possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering
  11. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images where possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering
  12. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images where possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering
  13. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images when possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering
  14. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images when possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering
  15. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images when possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering
  16. Tips & Tricks • Avoid offscreen rendering • Cropping layers

    by mask, shadows • Each GC switch takes 0.2ms • 3 CG switches for rounded corners = 0.6ms • For 10 rows = 6ms
  17. Tips & Tricks • Don’t use UILabel with NSAttributedString •

    All size calculations in background • Sometimes UIButton is very expensive • Use stretchable images when possible • Use 4 separated stretchable images for outlines • Avoid offscreen rendering • Avoid Autolayout usage
  18. Tips & Tricks • Flatting view hierarchy in background •

    Simplified view hierarchy => low backboardd • Doesn’t block main thread • Only for static parts of cell
  19. Tips & Tricks • Use QoS from iOS 8 •

    Or implement your own • LOW, HIGH, and DEFAULT queues are almost the same (priorities 28, 30, 32) • Main thread has priority about 40-45 • backboardd priority is about 50