icecreamliker / mobile

practical tips & tricks for mobile developing under ios

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

  1. 添加 -webkit-overflow-scrolling: touch; 可以使页面自然滚动。
  2. 尽量使用transform和opacity完成sprite动画,减少recalculate、reflow等性能消耗。
  3. 基本的ios版本适配 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { } @media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (max-device-height: 568px) and (orientation : portrait) { } @media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (max-device-height: 480px) and (orientation : portrait) { }
  4. 动画的同时,开始播放audio会造成顿卡现象,可以使用setTimeout来缓解性能瓶颈。
  5. flexbox在ios系统下完美展现(包括国外的android系统),但在部分国内手机下显示会有问题,建议慎用。
  6. 可以使用createObjectURL来展示web端通过file获取的图片,视频,音频等,一定要记得及时通过revokeObjectURL释放内存。

About

practical tips & tricks for mobile developing under ios

License:MIT License