Development

Chromeを48.0.2564.97にアップデートしたらレンダリングが非常に遅くなってしまった

結論から言うと CSSプロパティ `font-feature-settings` を設定すると特定のChromeバージョンにおいてレンダリング(layout, painting)が非常に遅くなる(レポート報告済)。

font-feature-settingsとは?

OpenType Fontの先進的なタイポグラフィーの機能を使用するためのプロパティ。下記のような機能がある。

  • font-kerning (カーニング)
  • legature (合字)
  • pnum (Proportional figures)

Demoを見つけたので共有: http://clagnut.com/sandbox/css3/

なぜ使っていたのか?

プロジェクト開始時は `normalize.css` と bourbonファミリーを下地にすることが多いのですが、bourbonファミリーの一つであるbittersで生成したbase cssにそれが入っていたようです。

対策

今回この現象が発生したプロジェクトでは `font-feature-settings` を使う意図が無かったので該当コードをCSSより削除しました。

標準