給產(chǎn)品經(jīng)理講技術(shù)丨朋友圈中的圖片緩存系統(tǒng)

每天早上8點(diǎn)，用5，6分鐘的時(shí)間給你講一個(gè)白話版技術(shù)分析，洗滌心靈，幫你擺脫工作不適癥狀。

每天堅(jiān)持很苦的，但是我樂(lè)意。

每天我都要刷十幾乃至幾十遍朋友圈，來(lái)獲取最新的資訊、八卦、行業(yè)大事兒，也順便看看周圍同事都在哪些國(guó)家玩耍，哪些同事又后半夜下班打不到車，還有最近周圍同事的孩子都成長(zhǎng)的怎么樣，哈哈。八卦、裝逼、賣萌、邀功，每天在朋友圈里悉數(shù)上演。

扯遠(yuǎn)了，我今天主要分析一下朋友圈的圖片緩存系統(tǒng)以及介紹一個(gè)緩存系統(tǒng)的設(shè)計(jì)要素。

緩存是什么？

緩是臨時(shí)的意思，存是存儲(chǔ)的意思，所以緩存就是臨時(shí)存儲(chǔ)的意思。什么東西適合臨時(shí)存儲(chǔ)呢？文字、網(wǎng)頁(yè)、圖片、數(shù)據(jù)？一切都適合臨時(shí)存儲(chǔ)，并且也都適合永久存儲(chǔ)，要看業(yè)務(wù)類型。

以朋友圈為例，你一定離不開這幾種場(chǎng)景：

刷了幾頁(yè)之后，然后回到頭部，你會(huì)發(fā)現(xiàn)看過(guò)的圖片依舊在顯示，并沒(méi)有重新出現(xiàn)占位符，然后再顯示出圖片，表明這張圖片一直在內(nèi)存中，隨時(shí)可被使用。 點(diǎn)擊一條新內(nèi)容的圖片時(shí)，會(huì)展示一張小的縮略圖，然后loading一直在轉(zhuǎn)，過(guò)了一會(huì)兒一張清晰無(wú)碼大圖展現(xiàn)出來(lái)，表明這張圖片是從網(wǎng)絡(luò)拉取回來(lái)的，隨后再被使用。loading的過(guò)程中，只存在一張小的縮略圖。 當(dāng)你翻到幾天前的內(nèi)容，打開圖片的時(shí)候，有的時(shí)候跟2一樣，從網(wǎng)絡(luò)拉取，有的時(shí)候，瞬間打開，這是為啥呢？因?yàn)橛锌赡苓€在緩存系統(tǒng)中，瞬間被使用。也有可能被淘汰刪除掉了，所以從網(wǎng)絡(luò)重新拉取。

這幾種情況基本涵蓋了一個(gè)App或者其他應(yīng)用程序所使用緩存系統(tǒng)的所有場(chǎng)景，只不過(guò)這個(gè)舉例以圖片為主，其他原理類似。

緩存系統(tǒng)經(jīng)常分為兩級(jí)，稱為一級(jí)緩存，二級(jí)緩存。一級(jí)緩存也叫內(nèi)存緩存，二級(jí)緩存也叫硬盤緩存(手機(jī)App中，在Sd卡上)。很顯然，一級(jí)緩存存取速度更快，程序退出數(shù)據(jù)就消失，不可一直保留，且多占了一些內(nèi)存，容易被人叨逼叨的說(shuō)程序占內(nèi)存大，把系統(tǒng)拖慢了，其實(shí)這是非常合理的一種以空間換取時(shí)間的程序設(shè)計(jì)。二級(jí)緩存容量可以更大，速度要慢一些，程序下次啟動(dòng)時(shí)候，依然可以使用。如果你不知道內(nèi)存為什么比硬盤快，請(qǐng)出門左轉(zhuǎn)看看以前的文章，哈。

所以緩存系統(tǒng)設(shè)計(jì)就是分配兩塊存儲(chǔ)空間，一塊在內(nèi)存，一塊在硬盤，假設(shè)內(nèi)存分配5Mb，硬盤分配100Mb，前者叫一級(jí)緩存，后者叫二級(jí)緩存（硬盤相對(duì)比較便宜，所以一般分配要大些）。

現(xiàn)在來(lái)模擬下整個(gè)朋友圈的流程。

進(jìn)入朋友圈開刷，這些圖片就不斷的占用5Mb的內(nèi)存空間，這時(shí)你往回滑動(dòng)，你會(huì)發(fā)現(xiàn)剛才的圖片還都在，因?yàn)檫@個(gè)時(shí)候一級(jí)緩存還沒(méi)滿，還可以繼續(xù)吃，所有的圖片也都能正常滿足業(yè)務(wù)需求。

假設(shè)這個(gè)時(shí)候已經(jīng)滾動(dòng)到了第三屏，一級(jí)緩存5Mb空間已被占滿，達(dá)到上限，所以必然要進(jìn)行淘汰，目前業(yè)界一般會(huì)采用LRU（Least Recently Used）算法進(jìn)行淘汰，也就是最近最少被使用的圖片被淘汰（想想還是很貼心的，最近最少被使用，對(duì)一個(gè)功利的程序來(lái)說(shuō)，你是最佳人選，如果你在工作中最近最少被使用，要注意安全了哦，哈哈），所以按照朋友圈時(shí)間線的性質(zhì)，第一張圖片被淘汰出了一級(jí)緩存，它會(huì)被安放到二級(jí)緩存，也即存儲(chǔ)到了硬盤上，注意雖然叫“淘汰”，但也沒(méi)有那么慘，沒(méi)有被完全丟棄打入冷宮，也算有了個(gè)不錯(cuò)的歸宿，假設(shè)這個(gè)時(shí)候滑動(dòng)回第一張圖片所在的位置，這個(gè)時(shí)候內(nèi)存沒(méi)有這張圖片，一級(jí)緩存中沒(méi)有，一級(jí)緩存作為一個(gè)老好人，會(huì)問(wèn)二級(jí)緩存，“第一張圖片”在你哪里嗎？這個(gè)時(shí)候回答是肯定的，所以一級(jí)緩存又按照剛才的算法，淘汰一些其他最近最少被使用的圖片出去，保證第一張圖片能夠在內(nèi)存中，然后我們有又看到了第一張圖片。

繼續(xù)刷下去，我們會(huì)發(fā)現(xiàn)一級(jí)緩存5Mb滿了，一直在進(jìn)行換出換入操作，也就是淘汰一些，選進(jìn)來(lái)一些。硬盤100Mb的空間也有可能被撐滿，所以二級(jí)緩存也會(huì)進(jìn)行淘汰工作，因?yàn)樗亲钕旅娴囊粚?，所以只被?dòng)的接收一級(jí)緩存塞入圖片，以及自身的淘汰。

擴(kuò)展到一個(gè)新聞客戶端乃至任何一個(gè)應(yīng)用程序，整個(gè)流程都可按朋友圈自行腦補(bǔ)，原理都是一樣的，只不過(guò)對(duì)參數(shù)的配置略有不同，比如有的想提供更好的看圖體驗(yàn)，一級(jí)緩存設(shè)計(jì)的比較大，能夠同時(shí)瀏覽更多的圖片，不用經(jīng)常的換入換出，但是同時(shí)也耗用更多內(nèi)存，程序的穩(wěn)定性也帶來(lái)挑戰(zhàn)。二級(jí)緩存占用也可以設(shè)計(jì)的比較大，這樣一些被經(jīng)常使用的場(chǎng)景的圖片，就可以不用再?gòu)木W(wǎng)絡(luò)上拉取，但是占用大了，一些管家、衛(wèi)士就要出現(xiàn)了，說(shuō)某程序占用了多少多少空間，是否要現(xiàn)在清理，除非你是像微信這種全國(guó)人民不得不用的App，他們會(huì)相應(yīng)的提高閾值，清理也會(huì)更慎重。在計(jì)算機(jī)程序中，時(shí)刻充滿博弈，你想占用更多的資源，就面臨更多的風(fēng)險(xiǎn)，用戶體驗(yàn)和程序性能之間永遠(yuǎn)要做衡量，雖然有矛盾，但一定有一個(gè)最適合你自己所做業(yè)務(wù)的方案，雖然有可能也是要經(jīng)過(guò)取舍的。

再舉個(gè)例子，微信的第二個(gè)tab是通訊錄，當(dāng)列表快速滑動(dòng)的時(shí)候，滑動(dòng)過(guò)程中，很多頭像都是默認(rèn)的灰頭像，為什么是默認(rèn)頭像呢，因?yàn)榛瑒?dòng)的時(shí)候再去讀相應(yīng)的頭像，并且對(duì)圖片解碼，會(huì)使整個(gè)列表的滑動(dòng)掉幀卡頓。一些新聞客戶端的做法又恰恰不同，比如滑動(dòng)的過(guò)程中，圖片就一張接著一張出來(lái)，明顯感覺(jué)是有些卡頓的，但是慢慢滑動(dòng)是不會(huì)的。所以對(duì)于關(guān)鍵路徑的理解是選擇技術(shù)方案的最重要的要素。

我來(lái)談?wù)勛约旱睦斫?，為什么列表有可能?huì)卡頓，但是大家選擇了不同的做法？微信通訊錄的主場(chǎng)景是查找，按字母排序，很可能是快速的滑動(dòng)，所以卡頓體驗(yàn)相當(dāng)不好，所以舍棄了一點(diǎn)點(diǎn)的滑動(dòng)過(guò)程中的效果。一個(gè)新聞客戶端的主場(chǎng)景是瀏覽新聞，應(yīng)該是慢慢滑動(dòng)，這個(gè)時(shí)候快速滑動(dòng)的卡頓感會(huì)被削弱，也即大多數(shù)用戶是不會(huì)用力滑動(dòng)的，而大多數(shù)慢慢搓動(dòng)刷新聞。所以對(duì)于關(guān)鍵路徑的理解不同，所產(chǎn)生的技術(shù)方案也不相同。

《羋月傳》中，大王娶了很多老婆，這些老婆在被開苞之后，全部被扔到了一級(jí)緩存中，隨時(shí)等待大王臨幸，但因?yàn)榇笸跄挲g越來(lái)越大，體力越來(lái)越差，并且伴隨著羋月和大王越來(lái)越match，羋姝，魏琰隨即被淘汰到了二級(jí)緩存中，這些心機(jī)較重的女人，如果能適時(shí)收手，也許還會(huì)被重新?lián)Q入到一級(jí)緩存中，和大王有更多的機(jī)會(huì)見面，但多行不義必自斃，今天晚上的故事劇情應(yīng)該就是他們被從二級(jí)緩存中徹底刪除……

歡迎添加微信公眾號(hào)：給產(chǎn)品經(jīng)理講技術(shù)