1

私は最近この質問をしました:斜めの要素に CSS ボーダーを作成するにはどうすればよいですか?

質問:ナビゲーション メニューに画像や複雑な CSS を使用すると、メモリや CPU の負荷が高くなりますか?

質問:クロス ブラウザー/画面サイズはさておき、上記以外の理由で、どちらが優れているのでしょうか?

ありがとうございました！

4

1 に答える 1

1

最終的に、デバイスはピクセルの配列を表示する必要があります。これらのピクセルの画像ファイルを送信すると、表示できるようになります。これらのピクセルを作成するために複雑なcssを送信する場合、ネットワーク全体で必要なバイト数は少なくなる可能性がありますが、プロセッサはピクセル配列を表示する前にレンダリングする必要があります。

cssとイメージのどちらを使用するかは、さまざまな考慮事項によって異なります。ここにいくつかあります：

  • 表示する必要があるものは常に正確に同じサイズですか？次に、画像ファイルには、すでにレンダリングされているという利点があります。そうでない場合、cssは効率的にサイズ設定する機能を提供します。

  • ユーザーは常に良好なネットワーク接続を持っていますか？その場合、事前にレンダリングされた画像と、場合によってはロードする画像を決定するための一連のメディアクエリcssを送信しても、パフォーマンスが低下することはありません。

  • 画面上で非常に大きくレンダリングしようとしているものはありますか？その場合、cssは大きな画像ファイルをロードするよりも有利な場合があります。

  • cssは非常に複雑で、記述に多くのコードが必要ですか？次に、画像ファイルには前処理されるというCPUの利点があります。

  • 表示項目に関連するアニメーションの状態やその他のアニメーションはありますか？その場合、cssには、潜在的に大きな画像ファイルを複数ロードする必要がないという利点があります。ただし、州のアニメーションが非常に複雑で、多くのコード、つまりCPUを使用している場合は、前のガイドラインが適用されます。

2番目の質問：cssにクロスブラウザーの問題がある場合、事前にレンダリングされた画像はそれらを排除します。ただし、非常に多くの異なるディスプレイサイズを持つレスポンシブディスプレイオブジェクトを構築している場合、cssにはスケーラビリティの利点があります。とはいえ、レスポンシブデザインの基本的な概念は、画像のいくつかの異なるサイズのバージョンを提供することです。

一般に、画像ファイルには帯域幅が必要であり、css/vectorsにはCPUが必要です。

于 2012-12-09T01:23:03.693 に答える