フォント レンダリングの変更により、ハードウェア アクセラレーションを使用するブラウザ間でフォント サイズが同じではないことに気付きました。文字が小さく表示されます。水平方向のナビゲーションを備えたサイトでは、これが実際に問題になりつつあります。
JavaScript または JS ライブラリを使用して、ブラウザーでハードウェア アクセラレーションが有効 (または無効) であることを検出できますか?
Modernizr はこの選択肢を提供していないようです。
フォント レンダリングの変更により、ハードウェア アクセラレーションを使用するブラウザ間でフォント サイズが同じではないことに気付きました。文字が小さく表示されます。水平方向のナビゲーションを備えたサイトでは、これが実際に問題になりつつあります。
JavaScript または JS ライブラリを使用して、ブラウザーでハードウェア アクセラレーションが有効 (または無効) であることを検出できますか?
Modernizr はこの選択肢を提供していないようです。
フォントのレンダリングは、ブラウザ、OS、およびユーザー設定によって異なります。したがって、Web サイトは、ピクセル単位の正確なフォント レンダリングに依存するのではなく、このような違いを適切に処理する必要があります。ハードウェア アクセラレーションは、このような違いのもう 1 つの原因です。
実際にはハードウェア アクセラレーションかどうかを調べることには興味がありませんが、フォント レンダリングの違いでは、レンダリングされたテキストのサイズを測定し、それに基づいてページを調整してみてはどうでしょうか。
ブラウザとプラットフォーム間のフォントサイズの違いにのみ関心があるので、フォントサイズの正規化手法を検討する価値があるかもしれません。
私が個人的によく知っているのはYUIFontsCSSだけです。私はすべてのプロジェクトでこれを使用しており、HTML5Boilerplateプロジェクトを使用しています。
Baseline、Typogridphy、Blueprint(このパスをたどる場合はこれをお勧めします)、そして最後にatatonicなどのcssタイポグラフィフレームワークもあります。
遅いレンダリングの回避策を用意するのではなく、アンダースコアのスロットルまたはデバウンスを使用してリフレッシュを減らしてみませんか?
<script type="text/javascript">
<!--
window.onload=function(){
if(window.screen.availHeight>700 && window.screen.availWidth>1000)
{
document.body.style.fontSize="15px";
}
.................
//another conditions
}
//-->
</script>
プロセッサの速度やRAMのサイズを取得することはできませんが、ハードウェアの強度を知る関数を作成できます
<script type="text/javascript">
var number=10;
var i;
var start = (new Date).getTime();
//code here
for(i=0;i<10000;i++)
{
number=number*10;
}
var diff = (new Date).getTime() - start;
alert(diff);
start = (new Date).getTime();
//code here
while(i<10000)
{
number=number*10;
i++;
}
diff = (new Date).getTime() - start;
alert(diff);
</script>