-
clockmaker
- 1786
- 0
- 2
- 0
- 0
-
- いいね！0
Shuichi Ishikawa
@spacelogue
Fast Performance with CSS on Mobileを聞きます。満員セッションです。 #maxjp
2013-05-09 02:57:11
Shuichi Ishikawa
@spacelogue
Layout: HTMLはDOMに、CSSはCSSOMになり、RenderTree→Layout→Paint という流れ #maxjp
2013-05-09 03:06:39
Shuichi Ishikawa
@spacelogue
layoutはやや、paintは一番コストがかかる。composite layers, match selectors to elementsはそんなにコストかからない。 #maxjp
2013-05-09 03:12:12
Shuichi Ishikawa
@spacelogue
1000 / 60fps = 16.6ms、この時間でJS, Layout, Painting, その他を16msで行う必要がある。 #maxjp
2013-05-09 03:17:33
Shuichi Ishikawa
@spacelogue
Timelineに切り替えて、レコーディング開始。停止して、見る幅を変えて、詳しく見る。 #maxjp
2013-05-09 03:26:33
Shuichi Ishikawa
@spacelogue
{ }というアイコンを押すと、jquery.min.jsを展開して表示できる。知らんかった！ #maxjp
2013-05-09 03:37:03
Shuichi Ishikawa
@spacelogue
スクロールすると、Heavy imagery will bust the GPU memory / Heavy paints / Full page repaints #maxjp
2013-05-09 03:40:32
Shuichi Ishikawa
@spacelogue
http://t.co/y1nYUTbUgj を例に、高コストのCSSプロパティを知る。 #maxjp
2013-05-09 03:47:05
Shuichi Ishikawa
@spacelogue
高いコストのCSSプロパティ: position:fixed, fixed background, border-radius&box-shadow, bg-size, @font-face, grandiants, text-align #maxjp
2013-05-09 03:49:49
Shuichi Ishikawa
@spacelogue
Enable continuous page repaintingをONにすると再描画にかかっている時間がみえる #maxjp
2013-05-09 03:51:33
Shuichi Ishikawa
@spacelogue
box-shadowとborder-radiusの両方のCSSプロパティを使ったときだけ、とても遅くなる。 #maxjp
2013-05-09 03:54:45