4 ms·
Was i the only person that was a little disappointed by this 'awareness' piece? I've recently noticed some unintuitive (initially) painting issues: box-shadows
by nsfmc 16y ago
Was i the only person that was a little disappointed by this 'awareness' piece?
I've recently noticed some unintuitive (initially) painting issues: box-shadows with large blur radii freak out webkit/mobile safari. I had thought my site was dying because of some wacky js pokery i was doing and spent a considerable amount of time tuning my js to no effect. it turned out that this was a problem with how shadows are drawn in css when atop (i.e. looks like they're composited live, so umm... watch out).
Who knew? This was a sort of performance issue i remember coming across in ios core animation lectures and never considered (stupidly) that might be an issue when you get dynamically generated shadows from css. But the moral here really is, while repaint and reflow are killer, also watch that you're not doing some insane paint, because, you know, that's also a performance hit.
Aside: I was really hoping for something like a webkit or chrome plugin that lets you watch paint/repaint/reflow for your own js-heavy sites like a slow-mo Timeline feature in webkit's inspector.
- vladocar 16y agoDid you try http://code.google.com/intl/it/webtoolkit/speedtracer/ http://code.google.com/intl/it/webtoolkit/speedtracer/ ?
- nsfmc 16y agoawesome! <tips hat>
- joakin 16y agoSame thing happened to me while coding with Sencha touch, and I thought it should be something with the library performance (ExtJS). After measuring everything correctly, and watching at the demo applications (which run fine on the phone) I saw that besides javascript work the difference where the box-shadows... Man that was a huge performance hit, removing them made the application actually usable, not like before.