在是移動開發(fā)的高潮時代，相信很多程序員都花時間去學(xué)習(xí)android，ios的開發(fā)，或者利用其他原生開發(fā)框架，今天小編要給大家推薦一個國產(chǎn)的超級神器 Hbuilder，相信這個神 器應(yīng)該有不少人知道，不知道的也沒有關(guān)系，今天知道也不晚。使用Hbuilder 可以一次編碼直接發(fā)布為 android,ios,Html5 web 的app,大家也都知道發(fā)到蘋果的APP商店中，是需要申請開發(fā)者賬號，而且每年要交美金。然而通過Hbuilder我們可以發(fā)布為流應(yīng)用（類似于小程序，其他騰訊的小程序晚于Dcloud的流用），IOS用戶只需要下載一個叫”流應(yīng)用“的App，即可運行我們自己生成的流應(yīng)用程序 。流應(yīng)用是一個內(nèi)核，一個運行環(huán)境引擎。

現(xiàn)在讓我們揭開他的蘆山真面目。

什么是HBuilder？

HBuilder是DCloud（數(shù)字天堂）推出的一款支持HTML5的Web開發(fā)IDE。HBuilder的編寫用到了Java、C、Web和Ruby。HBuilder本身主體是由Java編寫，它基于Eclipse，所以順其自然地兼容了Eclipse的插件。快，是HBuilder的最大優(yōu)勢，通過完整的語法提示和代碼輸入法、代碼塊等，大幅提升HTML、js、css的開發(fā)效率。

如何安裝 HBuilder？

HBuilder下載地址：在HBuilder官網(wǎng)http://www.dcloud.io/點擊免費下載，下載最新版的HBuilder。

HBuilder目前有兩個版本，一個是windows版，一個是mac版。下載的時候根據(jù)自己的電腦選擇適合自己的版本。

使用HBuilder新建項目

依次點擊文件→新建→選擇Web項目(按下Ctrl+N,W可以觸發(fā)快速新建(MacOS請使用Command+N,然后左鍵點擊Web項目))

如上圖，請在A處填寫新建項目的名稱，B處填寫(或選擇)項目保存路徑(更改此路徑HBuilder會記錄，下次默認(rèn)使用更改后的路徑)，C處可選擇使用的模板(可點擊自定義模板,參照打開目錄中的readme.txt自定義模板)

使用HBuilder創(chuàng)建HTML頁面

在項目資源管理器中選擇剛才新建的項目,依次點擊文件→新建→選擇HTML文件(按下Ctrl+N,W可以觸發(fā)快速新建(MacOS請使用Command+N,然后左鍵點擊HTML文件)),并選擇空白文件模板,如下圖

使用HBuilder邊改邊看試試查看編程效果

win系統(tǒng)按下Ctrl+P(MacOS為Command+P)進入邊改邊看模式,在此模式下,如果當(dāng)前打開的是HTML文件，每次保存均會自動刷新以顯示當(dāng)前頁面效果(若為JS、CSS文件，如與當(dāng)前瀏覽器視圖打開的頁面有引用關(guān)系，也會刷新)

HBuilder代碼塊大量減少重復(fù)代碼工作量

在打開的getstart.html中輸入H,如下圖

然后按下8,自動生成HTML的基本代碼如下圖

什么是代碼塊?

代碼塊是常用的代碼組合，比如在js中輸入$，回車，則可以自動輸入document.getElementById(id)。

查看、編輯代碼塊可以在工具-自定義代碼塊中，選擇相應(yīng)的代碼塊進行查看和編輯。也可以在激活代碼塊的代碼助手中，點擊詳細信息右下角的修改圖標(biāo)進行修改和查看。

• 代碼塊激活字符原則1:連續(xù)單詞的首字母。比如：dg激活document.getElementById("");vari激活var i=0;dn激活display: none;

• 代碼塊激活字符原則2:整段HTML一般使用tag的名稱。比如script、style，通常，敲最多4個字母即可匹配到需要的代碼塊，不需要完整錄入，如sc回車、st回車，即可完成script、style標(biāo)簽的輸入。

• 代碼塊激活字符原則3:同一個tag，有多個代碼塊輸出，則在最后加后綴。比如meta輸出但metau則輸出，metag同理。

• 代碼塊激活字符原則4:如果原始語法超過4個字符，針對常用語法，則第一個單詞的激活符使用縮寫。比如input button，縮寫為inbutton，同理intext是輸入框。

• 代碼塊激活字符原則5:js的關(guān)鍵字代碼塊，是在關(guān)鍵字最后加一個重復(fù)字母。比如if直接敲會提示if關(guān)鍵字，但iff回車，則出現(xiàn)if代碼塊。類似的有forr、withh等。由于funtion字母較長，為加快輸入速度，取fun縮寫，比如funn，輸出function代碼塊，而funa和func，分別輸出匿名函數(shù)和閉包。

靈活的快捷鍵使得編程過程手不離鍵盤

效果如下圖

• 新建html基本模板后,當(dāng)前光標(biāo)處于title標(biāo)簽內(nèi),此時我們給HTML設(shè)置title:hellohbuilder,完成后使用Ctrl+回車在當(dāng)前的下一行插入空行,并將光標(biāo)移動到下一行

• 我們在此處使用sc代碼塊生成一個script塊來編寫js代碼(輸入sc,回車)如下圖

• 使用funn代碼塊編寫一個JS方法helloworld(輸入funn,回車)如下圖

• 此時生成的方法的方法名是選中狀態(tài),我們只需要直接輸入新的方法名helloworld即可,如下圖

• 上圖中的綠色豎線，是代碼塊中指定的下一個編輯位置,敲擊回車光標(biāo)會直接跳轉(zhuǎn)至豎線位置

• 此時按向下、向下,Ctrl+回車,輸入style回車,生成css代碼區(qū)域

• 定義一個Css類classA：輸入. c l a s s A { 回車,f o n t 回車 回車 回車

• 然后按alt+下,alt+下跳轉(zhuǎn)至下一個編輯區(qū)域

• 依次輸入< d i v 也可輸入<dv回車、<iv回車,語法助手可以通過模糊匹配獲知想要生成的標(biāo)簽)如下圖

• 如上圖所示,代碼助手左側(cè)包含數(shù)字，可以使用這些數(shù)字選擇對應(yīng)的條目,右側(cè)包含瀏覽器兼容性數(shù)據(jù)及示例

• 輸入i 回車 d 1,右箭頭,空格,c 回車 回車

• 鼠標(biāo)在div標(biāo)簽的class屬性classA上懸浮,按下Alt和左鍵,點擊后可跳轉(zhuǎn)至classA定義處

• Ctrl+回車

• div也可以通過代碼塊生成如輸入divc回車回車回車,輸入helloworld如下圖

• 向下,回車

使用CSS選擇器語法來快速開發(fā)HTML和CSS(支持Emmet)

輸入div#page>div.logo+ul#navigation>li*2>a,按下tab生成代碼如下圖

HBuilder集成了Emmet功能,可以通過CSS選擇器語法來快速開發(fā)HTML和CSS,如想深入了解Emmet請移步http://www.emmet.io/

強大的JS解析引擎大大加快JS開發(fā)的速度

JS中提示HTML、CSS

JS提示html的ID

JS提示html的tagname

JS提示css類名

JS通過ID、tagname、css類名不但可以獲取HTML元素,還可以精確分析出其元素類型,準(zhǔn)確提示其屬性,如上圖可以提示出list[0].type

JS中提示JSON

JS提示自定義系統(tǒng)方法

JS提示對象引用及其屬性、方法

JS提示閉包對象

跳轉(zhuǎn)到class、id、js方法定義處

按下Alt,左鍵點擊引用的方法名、ID、CSS類、文件(鏈接、圖片),均可跳轉(zhuǎn)到引用的地方,跨文件的引用也可以哦

跳轉(zhuǎn)到JS方法定義處 如下圖

跳轉(zhuǎn)到CSS類定義處 如下圖

跳轉(zhuǎn)到ID定義處 如下圖

跳轉(zhuǎn)到文件 如下圖

更多挖寶

• 跳轉(zhuǎn)助手、選擇助手、轉(zhuǎn)義助手、快捷鍵助手，讓你手不離鍵盤。

• HTML5+支持、手機真機連調(diào)、云編譯，方便開發(fā)跨手機平臺的APP。

• 更多精彩功能：重構(gòu) | 大綱 | 任務(wù) | 版本歷史 | 內(nèi)置webserver | 實時升級 | 安全工程管理 | 包圍 | 掩碼轉(zhuǎn)換 | 智能糾錯 | 折疊代碼 | 轉(zhuǎn)到定義 | 格式化代碼 | URL編解碼 | 進制轉(zhuǎn)換 | 自動閉合。

• 還不滿足？下載插件增強更多功能，高手更可開發(fā)插件，并共享插件造福所有開發(fā)者。

HBuilder

入門

• 設(shè)計理念及常用功能

• Hello HBuilder

進階

• Emmet語法支持

• less、sass的支持和預(yù)編譯器

• HTML模板組使用指南

• 自定義語法提示&代碼塊

• JSDoc+規(guī)范

• 中文輸入法免干擾

• 分窗體、并列編輯器

• 真機運行常見問題

• 外部工具使用指南

• SVN、GIT等綁定操作快捷鍵

• 插件安裝

5+ APP

入門

• 5+ App概述

• 創(chuàng)建HelloWorld

• 調(diào)試打包

• mui開發(fā)注意事項

進階

• 窗口管理

• 下拉刷新

• 上拉加載

• 列表到詳情最佳實踐

• 應(yīng)用升級

• 推送服務(wù)

• 地圖定位

• 登錄授權(quán)（微信、微博）

• 快捷支付（微信、支付寶）

• 社交分享

• App優(yōu)化技巧

• 沉浸式狀態(tài)欄

• 代碼混淆加密

• 5+SDK 集成

• 5+SDK 插件開發(fā)

• Native.js調(diào)用原生API

• 蘋果打包證書申請指南

• 通過UrlSchemes與第三方應(yīng)用相互調(diào)用

• 培訓(xùn)資源視頻教程匯總

wap2app

入門

• wap2app概述

• sitemap.json概述

• matchUrls配置

• webviewParameter配置

• webviewParameter之titleNView配置

• easyConfig配置

• M站改造-去除元素

• app.js

進階

• NView模板概述

• NView模板-布局

• NView模板-標(biāo)簽

• NView模板-樣式

• NView模板-事件

• NView模板-數(shù)據(jù)綁定

• M站改造-原生定位

• M站改造-原生分享

• 選項卡切換優(yōu)化

流應(yīng)用

入門

• 流應(yīng)用介紹

• 視頻體驗及入口說明

• 流應(yīng)用開發(fā)指南

• 微信小程序轉(zhuǎn)流應(yīng)用指南

進階

• 流應(yīng)用更新方式說明

• 制作快碼

• H5游戲改造流應(yīng)用指南

• 如何在應(yīng)用A中給流應(yīng)用B導(dǎo)流

• 流應(yīng)用SDK集成

• gostream.js，wap站流量轉(zhuǎn)為app流量

感興趣的程序員可以到該網(wǎng)站具體看下：dcloud.io

從移動平臺崛起以來，HTML5移動應(yīng)用開發(fā)迅速變成了熱門話題，開發(fā)者們被各種開發(fā)HTML5移動應(yīng)用的方法搞得暈頭轉(zhuǎn)向，今天請到了金山云基礎(chǔ)架構(gòu)部研發(fā)負責(zé)人柴春燕給大家分享如何避免HTML5移動應(yīng)用最容易踩的那些坑。

柴春燕－－

微軟社區(qū)精英計劃博客組負責(zé)人，HTML5研究小組成員，擅長HTML5及移動應(yīng)用開發(fā)；

具有多年Web開發(fā)經(jīng)驗，曾參與開發(fā)微軟Visual Studio 2010中文學(xué)習(xí)平臺，基于SaaS模式的E-Learning系統(tǒng)；

曾負責(zé)當(dāng)當(dāng)網(wǎng)Web前端開發(fā)及移動應(yīng)用開發(fā)，擔(dān)任百度音樂高級研發(fā)工程師；

目前就職于金山云，初期負責(zé)金山云前端架構(gòu)，現(xiàn)任基礎(chǔ)架構(gòu)部研發(fā)經(jīng)理。

01/移動應(yīng)用中HTML5的新特性

工欲善其事，必先利其器。我比較推崇的學(xué)習(xí)技術(shù)的方式，是先整體了解，然后結(jié)合實際需求，再做針對性的學(xué)習(xí)。整體了解的方式，比較建議是直接看官網(wǎng)的API文檔，這里可以推薦幾個網(wǎng)站： http://www.w3school.com.cn/html5/index.asp, https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML5, http://www.html5rocks.com， http://caniuse.com/

其中，特別說明下http://caniuse.com/，通過這個網(wǎng)站，我們可以非常快速的查詢到你所想使用的html5的特性在各個瀏覽器，包括不同終端的瀏覽器的兼容性情況。

HTML5 在移動應(yīng)用開發(fā)上面能夠利用的特性主要有：

1. form input type

表單是我們在開發(fā)中經(jīng)常會遇到的，如果按照傳統(tǒng)的方式，要介入jquery validate或者自己寫正則進行判斷，但是其實html5的form表單新增的input type屬性，能夠快速幫我們實現(xiàn)所需要的功能。

2. video & audio

移動瀏覽器是不支持flash的，在一些微信專題活動中，經(jīng)常會看到嵌入音頻，那么audio標(biāo)簽就是比較適合的應(yīng)用場景，html5中audio提供的api attr還是比較全面的。

視頻格式一般有mp4和webm兩種格式，在使用的時候，一般建議同時生成兩種，根據(jù)瀏覽器兼容性，進行相應(yīng)的選擇。音頻audio，一般會同時制作mp3 ogg格式。

3. storage

關(guān)于web storage，大家可以參考我之前分享的一篇內(nèi)容：

http://www.chaichunyan.com/topics/html5-training/5.html5_storage/#/

重點是localstorage，尤其是我們在做移動應(yīng)用的性能優(yōu)化時，localstorage能夠發(fā)揮很大的作用。

學(xué)習(xí)的時候，建議大家?guī)е鴨栴}去學(xué)習(xí)，比方說“l(fā)ocalstorage最大的存儲容量是多少？”“有沒有有效期？”“cookie是有域的概念的，那么localstorage呢？”

4. css3

html5其實更多的是一個web標(biāo)準(zhǔn)，這個標(biāo)準(zhǔn)里邊，包含了html、JavaScript api、css。css3是我們在移動應(yīng)用中要重點學(xué)習(xí)和掌握的。

1.選擇器

2.自定義字體

3.多欄布局

4.文字,容器陰影

5.圓角

6.漸變效果

7.動畫 ...

大家可以通過下面一個例子有一個直觀的印象：

http://www.chaichunyan.com/topics/html5-training/7.css3_summary/demos/index.html

之前很多我們需要通過js或者切圖實現(xiàn)的效果，在移動端，就可以直接通過css3實現(xiàn)。

這里特別強調(diào)下關(guān)于布局，css3彈性布局，希望大家能夠仔細去了解，我在面試時候，必問的一道題，當(dāng)然，面試只是手段，更重要的是希望能夠?qū)W以致用，真正在實際工作中發(fā)揮作用。

flexbox布局的兼容性，彈性盒模型實現(xiàn)的原理，這些我們在做移動終端調(diào)試時候，如果只是靠反復(fù)試錯，那么效率是非常低的。

了解了html5的特性，開發(fā)者就會在移動應(yīng)用上一展身手了。

02/HTML5移動應(yīng)用中踩過的那些坑

1.布局

移動瀏覽器訪問的web站點，后面稱為mobile webapp哈（泛指移動終端瀏覽器訪問的web站點），能不能使用傳統(tǒng)的流式布局？答案是可以，但是要慎用。

mobile webapp對css3的彈性布局支持還是比較給力的，iOS Safari還好，但是Android的碎片化非常嚴(yán)重，尤其是Android上面各種第三方瀏覽器會做各種各樣的定制化，使用flexbox比float能夠減少你在布局調(diào)試上的時間，而且兼容性有保證。

2.圖片適配

這里邊要提供一個概念，是屏幕分辨率和物理分辨率，為什么我們使用ios看到的圖片清晰度那么高，原因是普通的手機屏幕，一點顯示一個像素，但是iphone4s 以后是一個點四個像素。

那按照320的設(shè)計稿切出來的圖片，在iphone上面顯示肯定是有鋸齒的。

處理方法可以參見我之前分享的一篇文章：圖片的適配與清晰度

http://blog.csdn.net/spring21st/article/details/7513906

3.字體

我把字體的處理分為兩類，一種是藝術(shù)字體、icon，另一種是我們在頁面中的字體。

移動終端對網(wǎng)絡(luò)的要求是比較高的，我們要盡可能減少網(wǎng)絡(luò)請求，圖片是非常大的網(wǎng)絡(luò)開銷，當(dāng)然，我們可以用合并圖片的方式減少請求數(shù)，但是請求量變大了。

css3支持web fonts，所以，我們可以引入字體文件，而不是所有的字體都是通過切圖的方式來實現(xiàn)。對于icon，一種方式是base64處理，但是現(xiàn)在更常見的做法，是轉(zhuǎn)換成矢量字體。

這里推薦一個網(wǎng)站：font awesome http://fortawesome.github.io/Font-Awesome/icon/css3/

這里邊涵蓋了大部分我們會用到的圖標(biāo)，當(dāng)然，公司有精力和人力的情況下，建議可以維護自己的矢量字體庫。

4.橫豎屏

我們可以通過css 的media query 判斷橫豎屏。

但是這種只能控制樣式展現(xiàn)，當(dāng)我們需要監(jiān)聽橫豎屏變化的時候，就只能通過js監(jiān)聽window.onorientationchange事件的方式實現(xiàn)。

但是，下面這種情況會讓你很無語：

那我們推薦下面這種實現(xiàn)方案：

相比較pc web，mobile webapp的調(diào)試更復(fù)雜，而且未知的問題更多，遇到問題，我們要有耐心去跟蹤定位，就像之前我們遇到iscroll性能問題、fast-click穿透的問題，都是一點一點排查處理的。

03/混合應(yīng)用（Hybrid）的注意事項

現(xiàn)在“快速迭代，敏捷開發(fā)，低成本上線“基本上是每家公司都追求的目標(biāo)，混合應(yīng)用就是在這種場景下應(yīng)運而生。

Hybrid App優(yōu)點眾多，Web前端工程師0成本介入，不依賴版本的實時更新，快速實現(xiàn)跨平臺需求，等等。但是，我對混合的看法是，根據(jù)實際情況合理使用，因地制宜。

那么什么樣的場景適合混合應(yīng)用開發(fā)？

1. 快速原型，驗證產(chǎn)品功能。我們之前開發(fā)過一個app，Android和iOS提供宿主環(huán)境，webview展現(xiàn)內(nèi)容都是通過html5實現(xiàn)的，半個月就開發(fā)上線了，較之傳統(tǒng)應(yīng)用開發(fā)人員成本和時間成本都縮短很多。

2. 內(nèi)容類的應(yīng)用，比如csdn的app，就是采用hbuilder混合方案實現(xiàn)的，對性能要求沒有那么高。

在考慮hybird的時候，要避免以下幾個誤區(qū)：

（1）為了HTML 5而Hybrid App

html5只是技術(shù)實現(xiàn)手段而已，要根據(jù)公司的實際業(yè)務(wù)場景，以及人員配比，綜合考慮，不能因為react native比較火，就必須要在公司推行這種實現(xiàn)方案，我覺得為技術(shù)而技術(shù)是不可取的。

（2）忽略移動應(yīng)用中的關(guān)鍵因素

mobile webapp本質(zhì)上還是基于PC的一種開發(fā)模式，開發(fā)者使用PC瀏覽器模擬App中的webview進行調(diào)試。PC瀏覽器與手機webview的區(qū)別是巨大的，包括能支配的CPU資源，最大占有的內(nèi)存，運行的網(wǎng)絡(luò)環(huán)境，click和touch事件的區(qū)別，瀏覽器對CSS/JS的解析和對事件處理等等。

app工程師考慮比較多的內(nèi)存的問題，這些在web開發(fā)時候是很少考慮的。另外，就是網(wǎng)絡(luò)環(huán)境方面，雖然現(xiàn)在3g、4g覆蓋率越來越高，但是移動終端的訪問和pc還是有很大差距，wifi和蜂窩網(wǎng)絡(luò)的切換，基站變化等諸多因素都會導(dǎo)致網(wǎng)絡(luò)間歇性斷開，web開發(fā)對于這種不穩(wěn)定網(wǎng)絡(luò)環(huán)境問題的處理上都有所欠缺。

（3）交互體驗一致性

ios和Android的交互設(shè)計是兩套規(guī)范，雖然有相似的地方，但是從操作習(xí)慣上，就已經(jīng)決定了，我們想用一套交互設(shè)計，適配兩個平臺是很難的，包括包括視覺風(fēng)格，界面切換，操作習(xí)慣等。

Hybrid App方案是一把雙刃劍，一方面它平衡了Native App和Web頁面的優(yōu)缺點，一定程度上解決了Native App開發(fā)過程中迭代慢，版本依賴，Native開發(fā)資源不足的問題，但另一個方面過度依賴Hybrid方案會造成Web前端開發(fā)成本快速上升，甚至造成App整體體驗下降，甚至造成功能缺失。

回到最開始那句話”不要為了Hybrid而Hybrid“，根據(jù)實際場景，控制好方案中native和web的邊界。

04/Q&A

Q1：關(guān)于響應(yīng)式開發(fā)中對于手機屏幕高度的解決有沒有什么好的解決方案？

響應(yīng)式開發(fā)本質(zhì)上是移動設(shè)計優(yōu)先的一種開發(fā)方式，我沒太明白對于手機屏幕高度的解決，具體的問題是什么樣的，原則上高度是不需要做處理的，除非是你對首屏有要求。關(guān)于響應(yīng)式開發(fā)，可以看看我這篇文章http://www.chaichunyan.com/index.php/2016/03/03/html5-wrd/

Q2:對首屏有要求的情況, 除了判斷高度還有沒有其他好的解決方案?如果是flex布局可以解決這個問題嗎？

問題的根本是獲取首屏的高度，（1）如果你是后端渲染的話，可以獲取機型和瀏覽器版本，拿到屏幕分辨率做適配 （2）根據(jù)屏幕寬度做適配，但是做不到完全絕對的首屏自適應(yīng)，如果有更好的方案，我再跟大家分享。

Q3:hybrid開發(fā)中，h5頁面太多的話，會不會影響ios發(fā)布？

之前有ios對phonegap這種跨平臺的應(yīng)用審核是不通過，不過現(xiàn)在放開這個限制了。h5頁面過多，會影響應(yīng)用的性能和體驗，建議可以把h5打包放到ipk里邊，但是要做好靜態(tài)資源的版本管理。

Q4：css3 彈性布局中， 由于android碎片化嚴(yán)重的問題， 能不能有好的案例指導(dǎo)？ 我們要求支持到android4以上版本。

真的要善用文檔和工具, http://caniuse.com/#search=flex, 我分享時候提到的這個網(wǎng)站，明確說明了flex兼容性。

如果是Android4.4以上機型，基本上可以放心使用，注意的地方有兩個：1. 要記得寫各個瀏覽器的css前綴 2. flex里邊可以嵌套flex.

Q5：hybird開發(fā)過程中， 原生代碼登錄權(quán)限問題，h5部分的頁面，如何共享登錄相關(guān)信息？

這要看你實現(xiàn)的方案，（1）嵌套靜態(tài)的h5頁面，那么需要native打開webview的時候，使用js briage調(diào)用頁面js的方法，寫入用戶信息，實現(xiàn)登錄共享 （2）如果打開的是動態(tài)渲染的頁面（如php輸出的頁面），那么可以在請求的url中攜帶用戶token，php通過query string判斷驗證，這個是native和webview數(shù)據(jù)交互的問題。

Q6：h5動畫在部分安卓webview中有時候會出現(xiàn)卡頓,這種情況改怎么優(yōu)化呢?

1. 可以做簡單的測試，看看瀏覽器支持的情況，如果瀏覽器支持不夠好，那么可能要做降級處理。

2. 減少動畫效果，因為動畫是要使用gpu渲染的，原生app能夠流暢，很大程度上是直接調(diào)用硬件處理的。

優(yōu)化的方案我這邊基本上是降級處理，Android低版本不支持的話，就使用基本動畫，比方不會使用3D翻轉(zhuǎn)。因為h5畢竟受限于webview環(huán)境，像jquery 和 zepto都提供對機型和瀏覽器的判斷。

Q7：在移動端瀏覽器上能支持h5離線存儲的性能嗎？

No problem.我們在實際項目中，優(yōu)化前端性能，曾經(jīng)用localstorage做靜態(tài)資源的版本管理和存儲。

更多技術(shù)干貨關(guān)注公眾號“極牛”。