當(dāng)前端在談?wù)撐⑿判〕绦虻臅r(shí)候弟跑，iOS 開發(fā)在談?wù)撌裁础?br>
? ? ? ? 本職是iOS 移動(dòng)開發(fā)的灾前，最近研究了一下比較火的微信小程序友酱。前端0基礎(chǔ)网杆，研究也不是很透徹，所以大家一定要保持懷疑的態(tài)度看這一篇分享啤挎。由于是本職是iOS開發(fā)所以在開發(fā)小程序的時(shí)候也會(huì)按照之前iOS開發(fā)的一點(diǎn)點(diǎn)經(jīng)驗(yàn)來搭建小程序饲嗽。所以主要是從幾個(gè)應(yīng)用框架層來比較說明一下iOS 和 微信小程序之間的異同點(diǎn)炭玫。理論基礎(chǔ)來自官方文檔再加上自己一點(diǎn)點(diǎn)實(shí)踐（從圖可以看出這渲染跟原生App很相像了）
1.網(wǎng)絡(luò)層
? ? ? ?網(wǎng)絡(luò)層：這是必要的基礎(chǔ)建設(shè)。
小程序：上圖是小程序的后臺(tái)服務(wù)器配置貌虾，必須要事先配置好服務(wù)器吞加，否則在程序中是無法正常請(qǐng)求的。一個(gè)小程序同時(shí)只能有一個(gè) WebSocket連接酝惧，并且同時(shí)也只能有5個(gè)網(wǎng)絡(luò)請(qǐng)求連接榴鼎。請(qǐng)求的服務(wù)器地址必須是HTTPS協(xié)議的伯诬，看了后臺(tái)服務(wù)器地址配置晚唇，上傳和下載文件的服務(wù)器也是單獨(dú)設(shè)置。很重要的一點(diǎn)也令人頭疼的是小程序是不支持H5頁面跳轉(zhuǎn)也是不支持cookie盗似。
iOS ：蘋果規(guī)定從2017年1月起App內(nèi)的網(wǎng)絡(luò)鏈接強(qiáng)制使用HTTPS協(xié)議的哩陕，iOS 可以設(shè)置網(wǎng)絡(luò)請(qǐng)求數(shù)的。通過參數(shù)maxConcurrentOperationCount 來設(shè)置請(qǐng)求數(shù)赫舒，但是也不是任意設(shè)置的悍及，在2G網(wǎng)絡(luò)一次只能維持1個(gè)鏈接，3G是2個(gè)接癌，在WiFi和4G網(wǎng)絡(luò)環(huán)境下是不限鏈接數(shù)的心赶，這里說明下并不是并發(fā)鏈接數(shù)越多越好，越多占用帶寬越高缺猛，請(qǐng)求時(shí)間反而會(huì)延遲缨叫。
所以這里對(duì)小程序同時(shí)有5個(gè)網(wǎng)絡(luò)請(qǐng)求有點(diǎn)疑惑，是否不區(qū)分網(wǎng)絡(luò)荔燎？
這里數(shù)據(jù)回調(diào)處理比較類似耻姥。（小程序有點(diǎn)類似block)
2.本地持久化存儲(chǔ)/數(shù)據(jù)層
小程序：為每一個(gè)小程序提供了10M的緩存，用來存儲(chǔ)數(shù)據(jù)和文件有咨，現(xiàn)在是內(nèi)測(cè)階段琐簇，不知道以后會(huì)不會(huì)擴(kuò)容。
數(shù)據(jù)：看官方的API目前只支持”key-data”的簡(jiǎn)單鍵值存儲(chǔ)以及set/get/remove/clear數(shù)據(jù)操作座享，還不支持?jǐn)?shù)據(jù)庫婉商。
文件：在文件存儲(chǔ)方面似忧，小程序是默認(rèn)都是臨時(shí)路徑，本次程序運(yùn)行期間可以正常讀取据某，退出程序后就刪除橡娄。所以如果要持久存儲(chǔ)，需要再調(diào)用wx.saveFile放到本地存儲(chǔ)癣籽，下次打開程序還能正常訪問到挽唉。
iOS：為每一個(gè)App創(chuàng)建一個(gè)沙盒，沙河有3個(gè)文件夾Document/Library/tmp筷狼，根據(jù)這個(gè)文件夾的命名大概就可以猜出它們不同用途瓶籽。iOS 這邊存儲(chǔ)方案就種類繁多，品種豐富埂材。Core Data塑顺、SQLite、NSUserDefaul俏险、keychain严拒、plist、archive根據(jù)自己的需求選取數(shù)據(jù)存儲(chǔ)方案竖独。這里只是簡(jiǎn)單說明一下iOS 持久化存儲(chǔ)裤唠，其實(shí)它是非常龐大的一個(gè)點(diǎn)，iOS是一個(gè)小型的操作系統(tǒng)莹痢，存儲(chǔ)和文件操作是有一套完整的方案种蘸。
3.業(yè)務(wù)層/UI層
? ? ? ? 在小程序中一個(gè)完整的頁面page是由.js/.json/.wxml/.wxss這四個(gè)文件組成，每個(gè)界面.js .wxml是必選項(xiàng)其它兩項(xiàng)選填竞膳。iOS并沒有這樣的強(qiáng)制規(guī)定航瞭，一個(gè)界面可以完全在一個(gè)UIViewController里面完成，復(fù)雜的頁面iOS也是可以通過類似的文件拆分使得結(jié)構(gòu)更加清晰明了坦辟。
.js：頁面邏輯
? ? ? ? iOS中一個(gè)完整界面可以只有一個(gè)UIViewController刊侯，在UIViewController中實(shí)現(xiàn)了頁面的大部分邏輯代碼，在可讀性可以規(guī)范一下頁面的代碼布局锉走，屬性初始化滨彻，生命周期函數(shù)，回調(diào)函數(shù)挠日，事件處理疮绷，自定義方法等。代碼結(jié)構(gòu)布局大概是這樣子嚣潜，但是也不一定所有的UIViewController都要有冬骚。同樣小程序中也有同樣結(jié)構(gòu)數(shù)據(jù)，生命周期，控件綁定事件只冻，自定義方法庇麦。這樣可以提高代碼的可維護(hù)性和可讀性。畢竟小程序還沒有 control + 6這樣的快捷鍵喜德。
看到上面對(duì)比山橄，發(fā)現(xiàn)兩者還是很相似的，這樣對(duì)比看還是有助我們了解小程序舍悯。簡(jiǎn)單看生命周期函數(shù)航棱，是不是很眼熟，很熟悉萌衬，很親切.....
.json 公共配置
? ? ? ? 在.json文件中可以配置導(dǎo)航欄的樣式饮醇，tarBar的配置，刷新控件秕豫，網(wǎng)絡(luò)超時(shí)時(shí)間等朴艰。一個(gè)小程序只有一個(gè)總的app.json公共配置，其它的page也有.json文件但是只能配置導(dǎo)航欄的樣式混移，其它都繼承app.json里面的公共配置祠墅。很重要的一點(diǎn)就是你創(chuàng)建所有的.js的文件都需要添加到app.json中。不添加編譯器也不會(huì)報(bào)錯(cuò)歌径，但是你會(huì)發(fā)現(xiàn)跳轉(zhuǎn)到某個(gè)頁面一直不成功一直顯示不出來毁嗦，這個(gè)時(shí)候就要檢查一下有沒有在app.json中添加改文件了。
.wxml 頁面結(jié)構(gòu)
.wxss 頁面組件樣式
? ? ? ? 這個(gè).wxml可以想象成在UIViewController里面放一些控件沮脖，比如這個(gè)頁面有多少圖片金矛，按鈕芯急，已經(jīng)控件之間的層級(jí)關(guān)系勺届，綁定事件等。但是呢娶耍，在.wxml里面不能設(shè)置圖片的大小免姿，圓角，位置榕酒。這時(shí)候.wsxx的作用就體現(xiàn)出來了胚膊，.wxss主要是用來描述.wxml組件的樣式。
舉個(gè)例子：在App 中應(yīng)用廣泛的UITableView在小程序中是怎么實(shí)現(xiàn)的
? ? ? 小程序提供了很多UI組件想鹰，基本可以滿足大部分界面需求紊婉。這些組件基本都能在iOS中找到相對(duì)應(yīng)的。在小程序中這些組件是有一些共同屬性辑舷，同時(shí)每個(gè)組件又有自己一些獨(dú)有的屬性喻犁。跟在iOS 中很多UI控件都繼承同一個(gè)大類UIView是一樣的道理的。
4.動(dòng)畫
canvas：畫布。這是要單獨(dú)拿出來講肢础，動(dòng)畫這個(gè)東西呢还栓，真是一言難盡，水太深传轰，有點(diǎn)淌不動(dòng)剩盒。iOS 動(dòng)畫框架Core Animation 功能也是很龐大，有興趣可以看《iOS Core Animation: Advanced Techniques》
5.消息通知
? ? ? 小程序消息通知并沒有實(shí)踐實(shí)現(xiàn)過慨蛙，只能是看著文檔來瞎猜了辽聊。先看下iOS客戶端關(guān)于push消息通知的實(shí)現(xiàn)。
iOS ：主要是devToken,Provider,APNs這三者之間的交互期贫。App向注冊(cè)通知之后系統(tǒng)會(huì)返回一個(gè)devToken身隐，然后將這個(gè)devToken上傳服務(wù)器Provider。Provider將要發(fā)送給用戶的消息和devToken發(fā)送給APNs唯灵，最后由APNs向用戶設(shè)備發(fā)送通知消息（iOS 10 新增了Notification Extension的擴(kuò)展贾铝，使得Local Notification和Remote Notification都變得非常豐富。）
小程序：小程序這邊并不能像App那樣發(fā)送通知埠帕，但是提供了另一種通知方式-模板消息垢揩。這邊使用AppID 和 AppSecret 注冊(cè)獲取access_token。這個(gè)access_token是通過中控服務(wù)器來獲取和刷新敛瓷。所以我想把a(bǔ)ccess_token看作devToken,中控服務(wù)器就是Provider,微信下發(fā)模板消息的服務(wù)器就是APNs叁巨。
小結(jié)：devToken是客戶端獲取上傳到Provider服務(wù)器，這邊access_token是中控服務(wù)器來維護(hù)呐籽。還有小程序中模板消息的發(fā)起方還是要求證一下锋勺，跟微信服務(wù)器交互的是中控服務(wù)器還是小程序本身？具體模板消息參數(shù)設(shè)置官方API
6.支付
? ? ? ? 第三方支付接入客戶端都沒有接觸過狡蝶。但是在微信小程序里面直接呼起微信支付應(yīng)該比較簡(jiǎn)單庶橱，小程序也提供了接口，去看官方API吧贪惹。
7.開發(fā)工具
? ? ? ?開發(fā)工具調(diào)試頁面中wxml類似于Reveal界面調(diào)試工具苏章，可以動(dòng)態(tài)查看和修改應(yīng)用程序的界面，對(duì)于我這種新手學(xué)習(xí)和調(diào)試CSS各控件的樣式覺得非常的方便奏瞬。開發(fā)工具還在不斷更新枫绅，補(bǔ)充一些新的功能，更新API硼端，要是看到API跟本文有所不同請(qǐng)以官方API文檔為準(zhǔn)并淋，寫這篇文章的時(shí)候官方又有新的更新....
8.總結(jié)
? ? ? ?小程序是個(gè)小而美的東西，某些方面可以渲染的跟native一樣珍昨，也提供了消息通知和本地存儲(chǔ)的能力县耽，完全可以替代一些對(duì)native要求不是很高的App订咸。但從微信限定的10M內(nèi)存，頁面層級(jí)不能超過5層來說酬诀，小程序也不適合太過深度的用戶體驗(yàn)脏嚷。
