web性能優(yōu)化

Brenner 發(fā)布于2019-08-23 15:23 / 2877人閱讀

摘要：性能優(yōu)化是一個比較大的一個問題，不是一天兩天就能學(xué)會的，需要在日常中思考和學(xué)習(xí)。毫秒必爭，前端網(wǎng)頁性能最佳實踐這是一篇講關(guān)于性能優(yōu)化的。和的壓縮對頁面引用的樣式和文件進行壓縮，合并一些和文件減少請求等，也是性能優(yōu)化的一個方法。

web性能優(yōu)化是一個比較大的一個問題，不是一天兩天就能學(xué)會的，需要在日常中思考和學(xué)習(xí)。
先收藏一篇文章，以后有時間在慢慢研究。毫秒必爭，前端網(wǎng)頁性能最佳實踐這是一篇講關(guān)于web性能優(yōu)化的。
下面是講我工作中遇到的幾個優(yōu)化問題。

1.使用縮略圖優(yōu)化圖片顯示速度

手機端由于性能、資源和網(wǎng)絡(luò)的原因，沒法和電腦比，在手機上顯示圖片的時候，要顯示縮略圖。
之前做過一個項目，由于經(jīng)驗不足，沒有保存縮略圖，在手機上顯示的圖片都是原圖，圖片少的時候還能接受，圖片一多，整個頁面都卡死了，甚至微信都閃退了，后面改成在手機端顯示縮略圖之后，頁面的速度快了很多。
我是在上傳圖片的時候做了處理，多保存了一份縮略圖，原圖在可接受的范圍內(nèi)也做了壓縮。
圖片的大小是影響性能的一個很重要的因素。

2.css和js的壓縮

對頁面引用的樣式和js文件進行壓縮，合并一些js和css文件減少請求等，也是web性能優(yōu)化的一個方法。
我們的站點都是使用ASP.NET MVC開發(fā)的，文件壓縮合并使用的是ASP.Net MVC中自帶的Bundle進行壓縮合并，使用bundle主要的作用就是壓縮和合并文件，減小請求的體積和次數(shù)，當文件有更新的時候，還能幫忙清除瀏覽器緩存，是使用Asp.Net MVC開發(fā)站點壓縮文件的首選。
這里還需要注意的是，bundle壓縮的文件最好能獨立運行，有依賴關(guān)系的要進行合并壓縮，不然可能會報錯。

后面如果還用到了什么優(yōu)化的方法會繼續(xù)更新