Nick Babich – 早在 2016 年的時(shí)候，移動(dòng)端流量就已經(jīng)超越桌面端成為目前主流。根據Google UK 的研究，如今65%的英國成年人都以智能手機作為他們的主要上網(wǎng)設備。

人們通過(guò)移動(dòng)端設備搜索信息，在線(xiàn)購物，使用移動(dòng)端設備訂閱各種服務(wù)。用戶(hù)偏好上的轉變推動(dòng)著(zhù)用戶(hù)期望發(fā)生變化?，F如今，絕大多數的用戶(hù)比以往更沒(méi)有耐心，當他們希望得到某個(gè)東西的時(shí)候，通常希望立刻能得到，否則，他們會(huì )迅速離開(kāi)，選擇其他的方案。

在如今的移動(dòng)端產(chǎn)品當中，加載緩慢，登錄艱難，流程復雜是常見(jiàn)的問(wèn)題，今天的文章將會(huì )為你提供一系列“提速”的技巧。

緩慢的頁(yè)面加載

隨著(zhù)技術(shù)的發(fā)展，越來(lái)越快的頁(yè)面加載體驗，使得比以往更不愿意等待加載了。

2/ 3 的移動(dòng)端用戶(hù)表示，頁(yè)面的加載速度對于他們的瀏覽體驗而言影響是最大的。

Google 對全球范圍內900000 個(gè)移動(dòng)端網(wǎng)站進(jìn)行了測試，發(fā)現這些網(wǎng)站的平均加載時(shí)長(cháng)為 22 秒。與此同時(shí)，研究表明，如果移動(dòng)端頁(yè)面加載時(shí)間超過(guò) 3 秒，53%的用戶(hù)將會(huì )直接離開(kāi)。

1、試圖找出造成問(wèn)題的原因

如果對于你的網(wǎng)站而言，加載緩慢是一個(gè)常見(jiàn)的情況的話(huà)，那么你應該盡量找出問(wèn)題所在。通常，頁(yè)面加載的時(shí)間受到下面的因素的影響：

視覺(jué)元素（圖片和動(dòng)畫(huà)）。高清的圖片和流暢的動(dòng)畫(huà)只有在不影響加載時(shí)間的前提下，才能帶來(lái)良好的體驗。

自定義字體。和其他的素材一樣，下載自定義的字體會(huì )需要一點(diǎn)時(shí)間，如果字體是被第三方服務(wù)所托管，那么這個(gè)時(shí)間還要長(cháng)。

商業(yè)邏輯。代碼質(zhì)量。

基礎設施。你的網(wǎng)站所采用的硬件。

2、測試你的網(wǎng)站

測試網(wǎng)站性能的工具并不少，其中之一就是Google 的Test My Site ，這個(gè)網(wǎng)站將會(huì )為你提供如何加速和改進(jìn)網(wǎng)站的可行性報告。

WebPage Test 是另外一個(gè)非常有用的工具，它將會(huì )從全球不同的地方來(lái)使用真實(shí)的瀏覽器（IE和Chrome）來(lái)測試用戶(hù)瀏覽的時(shí)候的真實(shí)數據。

3、使用骨架布局

如果你想在現有的條件下讓網(wǎng)頁(yè)更快一點(diǎn)，那么你可以試著(zhù)讓它在視覺(jué)體驗上更“快”一些。

在加載頁(yè)面的過(guò)程中先加載整個(gè)布局的骨架，能給人一種速度感，一種看起來(lái)比實(shí)際加載要快得多的主觀(guān)感受。

看看 Codepen 這個(gè)純CSS代碼所構建的骨架布局吧，優(yōu)先加載布局讓用戶(hù)感受到頁(yè)面加載“有進(jìn)展”。