分類導(dǎo)航

高性能移動端開發(fā)

發(fā)布時間：2017年05月18日作者： IT網(wǎng)絡(luò)文摘 (該文來自筆記，點擊查看原文)

不知不覺，春節(jié)就過完了，還沒來得及好好享受就沒了。好想來一場說走就走的旅行??，不吹水了，直接進(jìn)入正題。

最近在做一個需求，發(fā)現(xiàn)了薄弱的地方，趁這個好機會深入了解一下，拓寬一下視野～

眾所周知，網(wǎng)頁不僅應(yīng)該被快速加載，同時還應(yīng)該流暢運行，比如快速響應(yīng)的交互，如絲般順滑的動畫……

在實際開發(fā)中如何做到上面所說的效果呢？

1. 確認(rèn)渲染性能的分析標(biāo)準(zhǔn)

2. 準(zhǔn)備尺子去衡量渲染性能標(biāo)準(zhǔn)

3. 對耗時多的地方進(jìn)行優(yōu)化

我們可以粗略的得到下面的優(yōu)化目標(biāo)

Android培訓(xùn),安卓培訓(xùn),手機開發(fā)培訓(xùn),移動開發(fā)培訓(xùn),云培訓(xùn)培訓(xùn)

第一個是首屏呈現(xiàn)時間，網(wǎng)上的資料已經(jīng)非常非常多了，壓縮代碼，使用webp圖片，使用sprite，按需加載，“直出”，CDN……

第二個是 16ms 優(yōu)化，本篇重點講16ms的優(yōu)化。

大多數(shù)設(shè)備的刷新頻率是60次/秒，（1000/60 = 16.6ms）也就說是瀏覽器對每一幀畫面的渲染工作要在16ms內(nèi)完成，超出這個時間，頁面的渲染就會出現(xiàn)卡頓現(xiàn)象，影響用戶體驗。

這就是上圖中的<16ms。瀏覽器在一幀里面，會做以下這些動作。當(dāng)然，有些步驟（比如 layout，paint）是可以省略的。

Android培訓(xùn),安卓培訓(xùn),手機開發(fā)培訓(xùn),移動開發(fā)培訓(xùn),云培訓(xùn)培訓(xùn)

<li id="uk0wa"><pre id="uk0wa"><acronym id="uk0wa"></acronym></pre></li><code id="uk0wa"></code>