css3 - iOS Safari runs out of memory with "-webkit-transform" -
http://jsfiddle.net/es4xg/8/ crashes retina devices.
ios safari "easily" runs out of memory , crashes when using -webkit-transform instructions. approach delivers impressive graphics but, on retina displays, seems consume lot of memory , cause crashes.
the demo above shows text displayed 150 times otherwise run on pc browser:
the font size , number of elements exaggerated cause crash. -webkit-transform: translate3d(0,0,0) intended force gpu accelerated drawing of each element.
in real application, using translatex,y,z, scale , others seem connected gpu use in same way. images , sprites used, not connected crashes directly.
given scenario above:
1) bug ios safari crashing?
2) plugging in apple instruments memory monitor, virtual memory climbs , seems culprit of crash. using memory?
3) there other gpu accelerated approach not consume lot of memory?
it crashes because height of hardware accelerated items 257,025px in example. in tests appeared mobile-safari can handle 20,000px in height before crashes.
the hardware-acceleration awesome don't abuse using everything.
to debug through need run safari on mac terminal following keys:
$> export ca_color_opaque=1 $> export ca_log_memory_usage=1 $> /applications/safari.app/contents/macos/safari ca_color_opaque shows elements accelerated.ca_log_memory_usage shows how memory used rendering.
have @ following links details:
Comments
Post a Comment