為什么是小程序？

為什么我們會(huì)開發(fā)小程序呢？或許是因?yàn)楣ぷ餍枰?，或許是源于自己的追求（來(lái)自名利的欲望），但我要說(shuō)——這是一種緣分，很美好的緣分，很多年后還值得慶幸的緣分

• 小程序目前可以分為三個(gè)階段

  • 一是語(yǔ)音和搖一搖（還有yue pao利器的傳說(shuō)）
  • 二是公眾號(hào)，也就是這時(shí)注定了小程序的出現(xiàn)是歷史的必然選擇（shihouzhuge），為什么這么說(shuō)呢？因?yàn)槲⑿旁陂_放了webview的同時(shí)加入了js-sdk的開發(fā)工具包，而這就是小程序的前身
  • 三就是當(dāng)下的微信os，能跑小程序的微信

• 我們繼續(xù)來(lái)說(shuō)說(shuō)第二點(diǎn)，有了js-sdk不就可以了嗎？不就可以打通微信了嗎？還要什么小程序？！可是人家是有夢(mèng)想的鵝廠啊?。?？

  • 先從技術(shù)上說(shuō)，js-sdk只是為傳統(tǒng)網(wǎng)頁(yè)提供包含微信api的開發(fā)工具包，并沒(méi)有解決移動(dòng)網(wǎng)頁(yè)遇到的體驗(yàn)不良問(wèn)題，所以小程序就做了

    • 資源離線存儲(chǔ)，提高加載速度
    • 提供更強(qiáng)的開放能力
    • 通過(guò)構(gòu)建組件系統(tǒng)實(shí)現(xiàn)對(duì)安全性的管控
    • 通過(guò)內(nèi)置實(shí)現(xiàn)的組件提高開發(fā)速度和降低開發(fā)成本
    • 開放入口啊，不像網(wǎng)頁(yè)只能通過(guò)鏈接打開
    • 加上其他XXX就搞出了比擬原生的體驗(yàn)（chadebushao）

  • 微信的夢(mèng)想上說(shuō)

    • 作為一個(gè)月活超10億的超級(jí)app，人口紅利已達(dá)天花板，所以現(xiàn)在開始打時(shí)長(zhǎng)紅利的主意，拓展微信的使用場(chǎng)景，拓寬微信的邊界
    • 馬化騰親口說(shuō)過(guò)：從消費(fèi)互聯(lián)網(wǎng)到產(chǎn)業(yè)互聯(lián)網(wǎng)，隨著產(chǎn)業(yè)互聯(lián)網(wǎng)時(shí)代的到來(lái)，我們也在“連接產(chǎn)業(yè)”上尋求突破，而小程序就是連接產(chǎn)業(yè)互聯(lián)網(wǎng)的“利器”（聽不懂什么玩意）
    • 賺錢啊！鵝廠的夢(mèng)想?。?/li>

做什么樣的小程序？

回到上面的引子，為什么值得慶幸？因?yàn)樯厦嬲f(shuō)了——能降低開發(fā)成本，能提高用戶體驗(yàn)，能褥流量！能讓每個(gè)人都有機(jī)會(huì)搞事情?。?！搞什么呢？我也不知道，如果你有好的想法歡迎聯(lián)系我:smile:不過(guò)，這里分享下我的想法

• 戰(zhàn)線不能長(zhǎng)！張小龍說(shuō)過(guò)——"用完即走"，其實(shí)這不是原因，只是我調(diào)個(gè)書袋而已:joy:但微信確實(shí)是這樣啊，聊天、朋友圈，好像確實(shí)沒(méi)什么太喪心病狂的一直拉著你不走（好像現(xiàn)在還有看一看？始終記住——鵝廠有夢(mèng)想?。┧阅阕龅臇|西要符合人家產(chǎn)品的思想！好吧，說(shuō)個(gè)實(shí)際的場(chǎng)景，如果你要在小程序里的創(chuàng)作文章，那別人來(lái)一條信息你回不回？不回？你的思緒回不回被打亂？不會(huì)？你的心情會(huì)不會(huì)很煩？不會(huì)？:wave:你贏了，來(lái)生再見，所以權(quán)衡好你的功能設(shè)計(jì)，戰(zhàn)線越長(zhǎng)越容易死
• 短！平！快！ 對(duì)應(yīng)上面。就是快速進(jìn)入主題，功能點(diǎn)一目了然，功能也盡量單一，該干什么盡快干什么！例如讓用戶分享，讓用戶pay，快！快！快！不猶豫，讓用戶盡快上車
• 做矩陣，對(duì)應(yīng)上面，如果你想把a(bǔ)pp的功能都搬到小程序上，那一定要做功能拆分，做多個(gè)小程序形成矩陣

小程序os長(zhǎng)什么樣？

想種一個(gè)小程序總先知道這片土地什么樣吧？OK，歡迎來(lái)到小程序黑土地。。。

• 首先我們先說(shuō)說(shuō)小程序用到的兩個(gè)線程——渲染線程、腳本線程，與網(wǎng)頁(yè)開發(fā)不同，這兩個(gè)線程是分開的，分別運(yùn)行在不同的線程中，而網(wǎng)頁(yè)則是互斥的，也就是說(shuō)視圖和腳本被分開了，在不同的線程里，這就導(dǎo)致了和普通網(wǎng)頁(yè)開發(fā)一個(gè)很大的不同——沒(méi)有DOM API，而且也不是運(yùn)行在瀏覽器里所以也沒(méi)有BOM API
• 我們?cè)倏磮D還發(fā)現(xiàn)小程序總共有三種運(yùn)行環(huán)境，并且！每個(gè)環(huán)境兩個(gè)線程還都不一樣！所以同學(xué)們啊，在開發(fā)工具上行的在真機(jī)上不一定行??！可別太天真了，一定要在真機(jī)上驗(yàn)證功能的可行性！
• 我們有沒(méi)有想過(guò)小程序?yàn)槭裁匆M(fèi)那么大功夫重造輪子？不直接用成熟的web技術(shù)？說(shuō)是體驗(yàn)，其實(shí)我覺(jué)得最主要的是微信想管控一切，不是你想怎樣就可以怎樣，而是我讓你怎樣，你才能怎樣（至今我還對(duì)此很不爽）所以就干掉了靈活的web，別被我?guī)侠?mdash;—小程序并不是完全沒(méi)有了web，實(shí)際上你看到的就是web，只是沒(méi)有暴露出來(lái)，而是微信直接通過(guò)編譯小程序來(lái)替你操作了

既然是兩個(gè)線程，那必然要通信啊，要協(xié)作完成任務(wù)，那怎么實(shí)現(xiàn)的呢？看下面的通信模型

沒(méi)看到圖也能先想到是這個(gè)樣式:blush:，這里提示幾點(diǎn)

• 上圖中的Native是指微信客戶端
• 邏輯層發(fā)送網(wǎng)絡(luò)請(qǐng)求也經(jīng)由Native轉(zhuǎn)發(fā)
• 渲染層是由多個(gè)webview組成的，為什么？為了提供更好的交互體驗(yàn)呀，這樣也更貼近原生體驗(yàn)，同時(shí)避免了單個(gè)WebView的任務(wù)過(guò)于繁重，同時(shí)導(dǎo)致了小程序的生命周期不容易被理解（下面帶你理解）
• 通信是有時(shí)間成本的，所以在開發(fā)中我們最好使用異步接口

來(lái)看下生命周期

• 其實(shí)了解了渲染層是由多個(gè)webview組成的就很容易理解生命周期了

  • navigatebBack是返回上一個(gè)webview，銷毀當(dāng)前的webview
  • navigateTo是打開承載新頁(yè)面的webview，同時(shí)保留老的webview
  • redirectTo是在當(dāng)前webview里打開新的頁(yè)面
• 左下角有兩張拼一起的圖是switchTab的
• Tabbar頁(yè)面初始化之后不會(huì)被銷毀！所以Tabbar頁(yè)面不會(huì)unLoad，更多請(qǐng)參閱圖片