Velocity.js の CSS アニメーションに will-change を自動的に適用する - ONO TAKEHIKO - Medium

テクノロジーカテゴリーの変更を依頼記事元:

medium.com/@onotakehiko

4 usersがブックマークコメント

記事へのコメント1件

注目コメント
新着コメント

haiji505 will-change

2018/03/20 リンク

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

リンクを埋め込む

以下のコードをコピーしてサイトに埋め込むことができます

<iframe marginwidth="0" marginheight="0" src="https://b.hatena.ne.jp/entry.parts?url=https%3A%2F%2Fmedium.com%2F%40onotakehiko%2Fvelocity-js-%25E3%2581%25AE-css-%25E3%2582%25A2%25E3%2583%258B%25E3%2583%25A1%25E3%2583%25BC%25E3%2582%25B7%25E3%2583%25A7%25E3%2583%25B3%25E3%2581%25AB-will-change-%25E3%2582%2592%25E8%2587%25AA%25E5%258B%2595%25E7%259A%2584%25E3%2581%25AB%25E9%2581%25A9%25E7%2594%25A8%25E3%2581%2599%25E3%2582%258B-e0688b14e2ef" scrolling="no" frameborder="0" height="230" width="500"><div class="hatena-bookmark-detail-info"><a href="https://medium.com/@onotakehiko/velocity-js-%E3%81%AE-css-%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AB-will-change-%E3%82%92%E8%87%AA%E5%8B%95%E7%9A%84%E3%81%AB%E9%81%A9%E7%94%A8%E3%81%99%E3%82%8B-e0688b14e2ef">Velocity.js の CSS アニメーションに will-change を自動的に適用する - ONO TAKEHIKO - Medium</a><a href="https://b.hatena.ne.jp/entry/s/medium.com/@onotakehiko/velocity-js-%E3%81%AE-css-%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AB-will-change-%E3%82%92%E8%87%AA%E5%8B%95%E7%9A%84%E3%81%AB%E9%81%A9%E7%94%A8%E3%81%99%E3%82%8B-e0688b14e2ef">はてなブックマーク - Velocity.js の CSS アニメーションに will-change を自動的に適用する - ONO TAKEHIKO - Medium</a></div></iframe>

プレビュー

規約違反を報告

いまの話題をアプリでチェック！

バナー広告なし
ミュート機能あり
ダークモード搭載

アプリをダウンロード

Velocity.js の CSS アニメーションに will-change を自動的に適用する - ONO TAKEHIKO - Medium

いまは jQuery を使わず Vanilla で書くのがモダンな実装なのでしょうか。しかし流行にあまり左右された... いまは jQuery を使わず Vanilla で書くのがモダンな実装なのでしょうか。しかし流行にあまり左右されたくない自分はまだまだ jQuery を使い倒しています。何かトラブルに見舞われた際に先人のリソースが蓄積されているメリットもありますし。そしてそんな jQuery のアニメーションエンジンとして最も使われているだろうプラグインが Velocity.js かと思います。CSSアニメーションにも対応していてそのままでもかなり速く動作します。ただ CSS アニメーションについてはさらに最適化する方法があります。 CSS will-change とはあまりメジャーにはなっていないようですが、CSS にはアニメーションを最適化する will-change と呼ばれるプロパティが存在します。文字通りなので察しがつくところでもあるかと思いますが、ブラウザに対しあらかじめどの値が変化する