通過優(yōu)化網(wǎng)頁頁面降低對內(nèi)存及CPU的占用
互聯(lián)網(wǎng) 發(fā)布時間:2008-10-17 18:55:34 作者:佚名
我要評論

有的網(wǎng)頁看起來并不大但打開會很卡,有的網(wǎng)頁雖然很長但使用流暢,占用用戶電腦的內(nèi)存與CPU就影響這些。
瀏覽器問題,有各自的瀏覽器處理內(nèi)存問題會影響到,但幾乎沒辦法控制得了,Windows上的:
·IE系列,刷新回收的量不大,但最小化會釋放內(nèi)存。
&m
有的網(wǎng)頁看起來并不大但打開會很卡,有的網(wǎng)頁雖然很長但使用流暢,占用用戶電腦的內(nèi)存與CPU就影響這些。
瀏覽器問題,有各自的瀏覽器處理內(nèi)存問題會影響到,但幾乎沒辦法控制得了,Windows上的:
·IE系列,刷新回收的量不大,但最小化會釋放內(nèi)存。
·Firefox2據(jù)說也會在最小化回收,可我從沒見過最垃圾,用多少是多少,基本不回收。據(jù)說prototype的ajax還會引起內(nèi)存一直增加。
·Opera最好。一直控制得很好。不存在什么問題。
·Linux的內(nèi)存分配機制與Win的不一樣,有多少用多少,如果瀏覽器占光時說不定會干掉系統(tǒng)。
頁面問題,瀏覽器渲染頁面會消耗內(nèi)存和CPU,能減少一點就減少點。
結(jié)構(gòu)
使用DocType,告訴瀏覽器你在用什么,html4也有DTD。也許Transitional更適合你
如果使用的是XHTML并能保持良好結(jié)構(gòu)的話,記得輸出相應(yīng)的MIME跟XML頭1,可以減少瀏覽器的代碼檢查,
保持結(jié)構(gòu)的完整,不要讓瀏覽器幫你補全代碼。
控制頁面的文件大小,可以通過程序把為了看代碼比較舒服的縮進去掉。2~3K也是大小。
iframe會產(chǎn)生新的頁面,其實有很多方式可以代替iframe
引入的JS與CSS可以適當(dāng)合并,同樣背景圖片也可以合并,甚至有人連Flash都合并給已知寬高的內(nèi)容圖片/Object加上寬度的屬性可以減少頁面的局部重渲染
表現(xiàn)
質(zhì)量99跟70的jpg在大多數(shù)情況下只有文件有大小不一樣。gif的也一樣,特別是小圖標(biāo),256色跟128色的差別是文件大?。?br /> flash動得太快吃CPU很大,控制每秒的幀數(shù)及動畫的效果可以減少一些,如果把品質(zhì)用中低顯示會省很多資源,但這樣卻犧牲了效果。。quality屬性有時選擇Autolow2或者Autohigh會更適合,沒必要一直low或者best,
flash使用矢量圖會節(jié)省文件大小,但計算復(fù)雜的圖形跟動畫時花的是CPU。復(fù)雜的太多濾鏡,則會占用大量內(nèi)存,模糊濾鏡有減少些3。
IE的濾鏡也是比較占用內(nèi)存,同時也有兼容性問題。全屏的半透明很吃資源的。
2*2的圖片跟8*8的圖片大小差不多,但是平鋪背景2*2卻占用大很多。
gif動畫同樣有幀的概念,別把gif當(dāng)成flash來玩就行。
行為
別為了使用一個$()引入整個prototype或jQuery,它們有更多的作用。
AJAX很帥。但是用xml會用上XML解析器,有人推薦用JSON,可是這樣要eval數(shù)據(jù),其實可以直接import已經(jīng)是對象的script來用。只是要多傳個對象名,或者把對象名寫死,或者像flickr那樣jsonFlickrApi({"xxx":"xxx"}),直接當(dāng)函數(shù)用,挖哈哈。
實現(xiàn)某些效果時能用visibility:hidden解決時就別用display:none來玩。
在這里強調(diào)js變量要注全局跟局部等等的意義并不大,JS復(fù)雜的地方也不是一兩句能說得清的,關(guān)注大家關(guān)注月影的正在出版的新書吧。
其實這里有的內(nèi)容有不少跟如何快速的呈現(xiàn)我們的網(wǎng)頁相近,不過那篇是以處理服務(wù)端為主,但在很多時候,節(jié)省服務(wù)端資源消耗的同時也會節(jié)省客戶端的資源消耗。
?。g迎大家補充)
瀏覽器問題,有各自的瀏覽器處理內(nèi)存問題會影響到,但幾乎沒辦法控制得了,Windows上的:
·IE系列,刷新回收的量不大,但最小化會釋放內(nèi)存。
·Firefox2據(jù)說也會在最小化回收,可我從沒見過最垃圾,用多少是多少,基本不回收。據(jù)說prototype的ajax還會引起內(nèi)存一直增加。
·Opera最好。一直控制得很好。不存在什么問題。
·Linux的內(nèi)存分配機制與Win的不一樣,有多少用多少,如果瀏覽器占光時說不定會干掉系統(tǒng)。
頁面問題,瀏覽器渲染頁面會消耗內(nèi)存和CPU,能減少一點就減少點。
結(jié)構(gòu)
使用DocType,告訴瀏覽器你在用什么,html4也有DTD。也許Transitional更適合你
如果使用的是XHTML并能保持良好結(jié)構(gòu)的話,記得輸出相應(yīng)的MIME跟XML頭1,可以減少瀏覽器的代碼檢查,
保持結(jié)構(gòu)的完整,不要讓瀏覽器幫你補全代碼。
控制頁面的文件大小,可以通過程序把為了看代碼比較舒服的縮進去掉。2~3K也是大小。
iframe會產(chǎn)生新的頁面,其實有很多方式可以代替iframe
引入的JS與CSS可以適當(dāng)合并,同樣背景圖片也可以合并,甚至有人連Flash都合并給已知寬高的內(nèi)容圖片/Object加上寬度的屬性可以減少頁面的局部重渲染
表現(xiàn)
質(zhì)量99跟70的jpg在大多數(shù)情況下只有文件有大小不一樣。gif的也一樣,特別是小圖標(biāo),256色跟128色的差別是文件大?。?br /> flash動得太快吃CPU很大,控制每秒的幀數(shù)及動畫的效果可以減少一些,如果把品質(zhì)用中低顯示會省很多資源,但這樣卻犧牲了效果。。quality屬性有時選擇Autolow2或者Autohigh會更適合,沒必要一直low或者best,
flash使用矢量圖會節(jié)省文件大小,但計算復(fù)雜的圖形跟動畫時花的是CPU。復(fù)雜的太多濾鏡,則會占用大量內(nèi)存,模糊濾鏡有減少些3。
IE的濾鏡也是比較占用內(nèi)存,同時也有兼容性問題。全屏的半透明很吃資源的。
2*2的圖片跟8*8的圖片大小差不多,但是平鋪背景2*2卻占用大很多。
gif動畫同樣有幀的概念,別把gif當(dāng)成flash來玩就行。
行為
別為了使用一個$()引入整個prototype或jQuery,它們有更多的作用。
AJAX很帥。但是用xml會用上XML解析器,有人推薦用JSON,可是這樣要eval數(shù)據(jù),其實可以直接import已經(jīng)是對象的script來用。只是要多傳個對象名,或者把對象名寫死,或者像flickr那樣jsonFlickrApi({"xxx":"xxx"}),直接當(dāng)函數(shù)用,挖哈哈。
實現(xiàn)某些效果時能用visibility:hidden解決時就別用display:none來玩。
在這里強調(diào)js變量要注全局跟局部等等的意義并不大,JS復(fù)雜的地方也不是一兩句能說得清的,關(guān)注大家關(guān)注月影的正在出版的新書吧。
其實這里有的內(nèi)容有不少跟如何快速的呈現(xiàn)我們的網(wǎng)頁相近,不過那篇是以處理服務(wù)端為主,但在很多時候,節(jié)省服務(wù)端資源消耗的同時也會節(jié)省客戶端的資源消耗。
?。g迎大家補充)
相關(guān)文章
- HTML表格用于在網(wǎng)頁上展示數(shù)據(jù),通過標(biāo)簽及其相關(guān)標(biāo)簽來創(chuàng)建,表格由行和列組成,每一行包含一個或多個單元格,單元格可以包含文本、圖像、鏈接等元素,本文將詳細介紹HTML表格2025-03-12
- 本文介紹了三種禁止HTML頁面滾動的方法:通過CSS的overflow屬性、使用JavaScript的滾動事件監(jiān)聽器以及使用CSS的position:fixed屬性,每種方法都有其適用場景和優(yōu)缺點,感興2025-02-24
- 在 Web 開發(fā)中,文本的視覺效果是提升用戶體驗的重要因素之一,通過 CSS 技巧,我們可以創(chuàng)造出許多獨特的效果,例如文字鏤空效果,本文將帶你一步一步實現(xiàn)一個簡單的文字鏤空2024-11-17
- 在Html中,a標(biāo)簽?zāi)J的超鏈接樣式是藍色字體配下劃線,這可能不滿足所有設(shè)計需求,如需去除這些默認樣式,可以通過CSS來實現(xiàn),本文給大家介紹Html去除a標(biāo)簽的默認樣式的操作代碼2024-09-25
- 在HTML中,可以通過設(shè)置CSS的resize屬性為none,來禁止用戶手動拖動文本域(textarea)的大小,這種方法簡單有效,適用于大多數(shù)現(xiàn)代瀏覽器,但需要在老舊瀏覽器中進行測試以確保2024-09-25
- 本文詳細介紹了如何利用HTML和CSS實現(xiàn)多種風(fēng)格的進度條,包括基礎(chǔ)的水平進度條、環(huán)形進度條以及球形進度條等,還探討了如何通過動畫增強視覺效果,內(nèi)容涵蓋了使用HTML原生標(biāo)簽2024-09-19
- Canvas 提供了一套強大的 2D 繪圖 API,適用于各種圖形繪制、圖像處理和動畫制作,可以幫助你創(chuàng)建復(fù)雜且高效的網(wǎng)頁圖形應(yīng)用,這篇文章主要介紹了HTML中Canvas關(guān)鍵知識點總結(jié)2024-06-03
html table+css實現(xiàn)可編輯表格的示例代碼
本文主要介紹了html table+css實現(xiàn)可編輯表格的示例代碼,主要使用HTML5的contenteditable屬性,文中通過示例代碼介紹的非常詳細,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)2024-03-06- 本文主要介紹了HTML中使用Flex布局實現(xiàn)雙行夾批效果,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)2024-02-22
- 在網(wǎng)站開發(fā)中,登錄頁面是必不可少的一部分,本文就來介紹一下HTML+CSS實現(xiàn)登錄切換,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需2024-02-02