給產(chǎn)品經(jīng)理講技術(shù)丨究竟什么是渲染？

渲染這個(gè)詞，在計(jì)算機(jī)世界里可以說(shuō)無(wú)處不在，這個(gè)詞的理解對(duì)于理解一切電腦或手機(jī)上的展示與呈現(xiàn)至關(guān)重要，渲染的意思是呈現(xiàn)，也就是顯示出來(lái)的意思，瀏覽器呈現(xiàn)的是html，游戲里面呈現(xiàn)的是3D人物或地圖，手機(jī)App里面呈現(xiàn)的是各種界面。

一個(gè)畫(huà)家要畫(huà)一副油畫(huà)，我們看看整個(gè)過(guò)程是什么樣的，他首先在腦中構(gòu)思，在油畫(huà)的三分之一處畫(huà)一個(gè)房子，門(mén)前有一條小溪，房子后面有一座小山，然后他用鉛筆將每一個(gè)物體的輪廓勾勒出來(lái)，并對(duì)每個(gè)物體的擺放位置不斷調(diào)整，直到符合他的構(gòu)思，這副畫(huà)的骨架已經(jīng)搭建完成，下一步才是用不同的色彩將每一個(gè)部分細(xì)致的按照自己的逼格不斷完善。

計(jì)算機(jī)、瀏覽器、手機(jī)app的渲染道理一模一樣，你在顯示器上看到的一切也都經(jīng)歷了類(lèi)似的過(guò)程，大致分為三步：測(cè)量、排版、繪制。拿支付寶手機(jī)App舉例，我們進(jìn)入界面之后看到了那么多按鈕或TAB，計(jì)算機(jī)是如何知道哪個(gè)按鈕該擺在何處，應(yīng)該多寬多高，以及程序啟動(dòng)的時(shí)候應(yīng)該是呈現(xiàn)出什么樣子呢？

計(jì)算機(jī)里面存儲(chǔ)的全部是01組成的串（這些串既有程序代碼也有相應(yīng)的數(shù)據(jù)），他們靜靜的躺在你的硬盤(pán)或sd卡中，當(dāng)你點(diǎn)擊手機(jī)app上的支付寶圖標(biāo)的時(shí)候，這個(gè)時(shí)候存儲(chǔ)設(shè)備中的代碼和數(shù)據(jù)迅速被載入內(nèi)存，并加載執(zhí)行。

當(dāng)程序運(yùn)行到構(gòu)造界面的時(shí)候，這個(gè)時(shí)候計(jì)算機(jī)像畫(huà)家一樣開(kāi)始測(cè)量，每一個(gè)按鈕的寬高（其中是有一大堆算法或者說(shuō)規(guī)則在默默的計(jì)算，比如一個(gè)按鈕在另一個(gè)上方，如何不和其他的按鈕重疊等等）。知道了多寬多高之后，計(jì)算機(jī)開(kāi)始計(jì)算每一個(gè)按鈕應(yīng)該擺在屏幕上的什么位置。大小、位置都明確之后，計(jì)算機(jī)開(kāi)始繪制，也就是把相應(yīng)的顏色或者圖片資源從CPU輸送到顯卡，顯卡把這些數(shù)據(jù)發(fā)送給顯示器的緩沖區(qū)，屏幕的下一次刷新將這些新數(shù)據(jù)更新到顯示器上，整個(gè)渲染(呈現(xiàn))過(guò)程結(jié)束。

說(shuō)了很多廢話，想說(shuō)清楚的是，渲染是通過(guò)一些列計(jì)算并呈現(xiàn)的過(guò)程，其中包括測(cè)量、排版、繪制。你在任何屏幕上看到的任何一個(gè)圖形，無(wú)一例外，都經(jīng)過(guò)了這三個(gè)過(guò)程。

下次和程序界的朋友溝通展示慢，頓問(wèn)題的時(shí)候，你可以很隨意的說(shuō)句，感覺(jué)整個(gè)渲染過(guò)程不是很流暢，保證你們的交流會(huì)很得心應(yīng)手。

明天見(jiàn)，我不會(huì)告訴你明天我要講什么的:)。

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