2011-03-23 116 views
3

我注意到由於字體渲染改變使用硬件加速的瀏覽器中的字體大小不一樣 - 使得字符看起來更小。在具有水平導航的網站上,這實際上正在成爲一個問題。JavaScript中的瀏覽器可以檢測硬件加速嗎?

是否可以使用JavaScript或JS庫來檢測硬件加速是否在瀏覽器中啓用(或禁用)?

Modernizr似乎不提供這種選擇。

+0

IMO你問錯了問題。你不應該關心硬件加速。 – CodesInChaos 2011-03-23 11:20:21

+0

相關問題:http://stackoverflow.com/questions/4972074/is-there-a-way-to-programmatically-test-for-browser-gpu-acceleration。雖然如果你只是通過冠軍頭銜,它會是一個重複,但他真正想知道的問題是:「速度夠快嗎?」而這個問題真的是「它是否像我想要的那樣渲染?」 – CodesInChaos 2011-03-23 11:24:41

回答

7

字體呈現的不同取決於瀏覽器,操作系統和用戶設置。所以你的網站應該優雅地處理這些差異,而不是依靠像素精確的字體渲染。硬件加速只是這種差異的另一個來源。

由於您並不真正有興趣瞭解它是否是硬件加速,但在字體渲染方面的差異如何測量一些渲染文本的大小,並基於此來調整頁面?

+0

事實上,我想我並不完全確定在哪裏針對我的資源來解決問題 - 我所知道的是問題確實需要修復。歡呼輸入。 – 2011-03-23 11:24:25

-5
<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容量 但你可以使功能知道hardewre強度

<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> 
+1

難道沒有像樣的編譯器能夠優化整個循環嗎?第一個函數看起來會在頁面加載完成後調整下一個函數的大小。糟糕的用戶體驗。 – CodesInChaos 2011-03-23 11:38:19

+0

忙碌循環的計算速度(我相信您的訪問者會喜歡這種體驗)與硬件加速字體渲染沒有任何關係(這實際上只是原始海報試圖解決的問題的一個特例)。 – sarnold 2011-03-23 11:45:15

+0

即使循環沒有被優化,我也希望時間差爲零。在Windows上,時間函數不是很準確。根據正在運行的其他程序,它可能每16ms只更新一次。你的循環肯定會花費更少的時間。 – CodesInChaos 2011-03-23 12:18:01

2

由於您只對跨瀏覽器和平臺的字體大小的差異感興趣,因此可能需要查看字體大小標準化技術。

我個人唯一熟悉的是YUI Fonts CSS。我在我的所有項目中都使用它,並使用HTML5Boilerplate項目。

還有CSS排版框架,如BaselineTypogridphyBlueprint(我已經研究過這個建議,如果你走這條道路),最後atatonic

0

不是有緩慢的渲染解決方法,爲什麼不使用underscore的油門或去抖來減少刷新?