CSS will-changeプロパティについて知っておくべきこと | POSTD
はじめに WebKit系ブラウザでCSS transformやanimationといったプロパティを使った時に発生する、“例のちらつき”。これに気づいたことのある人ならば、おそらく“ハードウェア・アクセラレーション”という用語をこれまでにも耳にしたことがあるでしょう。 CPU, GPU, ハードウェア・アクセラレーション 一言で言うと、ハードウェア・アクセラレーションとは、グラフィックス・プロセッシング・ユニット（GPU）を用いてセントラル・プロセッシング・ユニット（CPU）の処理量を軽減し、ブラウザのレンダリング処理を効率化することです。ハードウェア・アクセラレーターを有効にしてCSS処理を使うと、ページのレンダリングが速くなり、ページ表示が高速化されます。 名前の通り、CPUとGPUはどちらもプロセッシング・ユニットです。CPUはコンピュータのマザーボードに取り付けられている部品で、ほ
Web制作にGPU処理を取り入れる
Updated 2013.10.24 / Published 2013.10.24 HexGLのようなWebGLのコンテンツを見ていると、これから本格的にWebがゲーム機の領域を浸食するようになっていくのかと、同じWebでもWebサイトを作る領域からすると動きの面で感心させられることしきりです。 なぜWebGLのアニメーションは滑らかなのか さておき、WebGLのコンテンツは非常に滑らかなアニメーションを実現できているわけですが、それはWebGLがCPUではなくGPUで処理されいるからとのことです。この場合のGPUで処理をするというのはソフトウェアであるブラウザがGPUを使ったハードウェア・アクセラレーションに対応していることが条件になります。つまり、CPU上でソフトウェア（ブラウザ）が処理する部分とGPU上のハードウェアで処理する部分を切り分けられる機能をもっているということになります。
vol.24 HTML+CSS3で軽快アニメーション！Web制作にGPU処理を - BOEL Inc. TIPS
こんにちは。Webエンジニアの毛利です。 今回はWebページ制作で軽快なアニメーション表現をしよう！がテーマです。 CSS3が本格的に浸透し始め、Webページにアニメーションを取り入れたい！とかんがえる場面も多くなりました。 CSS3を用い、アニメーションを実装するコツをお伝えします。 CPU？GPU？ GPUを取り入れる 軽快なアニメーションを表現するには「GPU」を使います。 Webページのレンダリングには「CPU」を使います。 「CPU」とは、かんたんに表現すると、司令塔です。 パソコンでいうと一番大事な部分で、ファイルを保存する、画像を開くなどの役割をしています。 レンダリング レンダリングとは英字や数字の羅列を、画面に画像として表示したり文章として表示したりすることをさします。 Webサイトで例えると、ソースコードの集合であるHTMLを画像や文章に変換しています。 HTMLにかか
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GPUアクセラレーターが使える環境で強制的に有効にできるCSSの指定方法 :: 5509
