蘑菇街 App 的元件化之路 續

2021-07-23 15:21:56 字數 2936 閱讀 1821

原文:

前幾天在「移動學習分享群」分享了關於蘑菇街元件化方面的一點經驗,由於時間和文字描述方面的限制,很多東西表述的不是很清楚,讓一些同學產生了疑惑,casatwy老師也寫了篇文章來糾正其中的一些實現,看完之後確實有不少啟發。

統一的呼叫實現

將「url 呼叫」和「元件間呼叫」通過 runtime 達到統一,通過 prefix 的方式來避免安全上的一些漏洞。看起來確實會舒服些,也比較靈活。

通過 category 來統一元件對外暴露的介面

支援openurl:但最終還是走的 target-action,跟內部呼叫無差別。 這也是我們目前有待提公升的點,想知道某個元件支援哪些 url 或 哪些 protocol 不夠方便,url 的引數傳遞也是個問題,將來 url 發生變動的話,調整起來也比較麻煩。後續會在這塊再加強下。

當初決定使用openurl:來做頁面間的跳轉,而不是方法呼叫,主要是考慮到我們的大部分場景都可以通過這種方式解決,因此就這麼定了。openurl:更像 android 裡的 「隱式 intent」,不關心誰來處理這個 url,由系統(mgjrouter)來決定。而方法呼叫更像「顯式 intent」或者 rpc,明確地知道應該由誰來處理。前者的好處是可以更少地關心業務邏輯,後者的好處是可以很方便地完成引數傳遞。

openurl只是頁面間的呼叫方式

元件間的呼叫通過 protocol 來實現

每個元件都有乙個entry,這個entry,主要做了三件事

註冊這個元件關心的 url

)];url 的註冊會有對應的 block,拿到這個 url 後,想怎麼折騰就怎麼折騰。

註冊這個元件能夠被呼叫的方法/屬性

當有一些場景不適合用 url 的方式時,就可以通過註冊 protocol 來實現

[modulemanager registerclass:classa forprotocol:protocola]的結果就是在 mm 內部維護的 dict 裡新加了乙個對映關係。

[modulemanager classforprotocol:protocola]的返回結果就是之前在 mm 內部 dict 裡 protocol 對應的 class,使用方不需要關心這個 class 是個什麼東東,反正實現了protocola協議,拿來用就行。

這裡需要有乙個公共的地方來容納這些 public protocl,也就是圖中的publicprotocl.h

同意,所以我們並不只有openurl一種方式

根本無法表達非常規物件

單純地通過openurl確實不太好表達,但我們並不只有openurl一種方式

註冊url的目的其實是乙個服務發現的過程,在ios領域中,服務發現的方式是不需要通過主動註冊的,使用runtime就可以了。另外,註冊部分的**的維護是乙個相對麻煩的事情,每一次支援新呼叫時,都要去維護一次註冊列表。如果有呼叫被棄用了,是經常會忘記刪專案的。runtime由於不存在註冊過程,那就也不會產生維護的操作,維護成本就降低了。

由於通過runtime做到了服務的自動發現,拓展呼叫介面的任務就僅在於各自的模組,任何一次新介面新增,新業務新增,都不必去主工程做操作,十分透明。

儘管通過 runtime 可以做到這些,但最終還是要通過維護category來暴露新增的 target-action,所以 runtime 雖然不存在註冊過程,但實際使用過程中,還是會有註冊過程,還是需要去維護。

沒有拆分遠端呼叫和本地間呼叫

以遠端呼叫的方式為本地間呼叫提供服務

同上

本地間呼叫無法傳遞非常規引數,複雜引數的傳遞方式非常醜陋

同上,使用 protocol

是的,就蘑菇街的方案來說,這步不可避免。

這個不必要的操作會導致不必要的維護成本

維護只是在元件內部做調整,並不需要在主工程裡做修改。如果採用 category 的方式,好處是不用在啟動時註冊,但當元件的介面有變動時,依然要維護 category,這個成本是免不了的。

新增元件化的呼叫路徑時,蘑菇街的操作相對複雜 在本文給出的元件化方案中,響應者唯一要做的事情就是提供target和action,並不需要再做其它的事情

沒有針對 target 層做封裝 這種做法使得所有的跨元件呼叫請求直接hit到業務模組,業務模組必然因此變得臃腫難以維護,屬於侵入式架構。應該將原本屬於呼叫相應的部分拿出來放在target-action中,才能盡可能保證不將無關**侵入到原有業務元件中,才能保證業務元件未來的遷移和修改不受元件呼叫的影響,以及降低為專案的元件化實施而帶來的時間成本。

「將原本屬於呼叫相應的部分拿出來放在target-action中」並不是唯一可行的方式,使用 protocol/url 註冊也可以達到效果。

低谷中的蘑菇街 押寶直播業務,止不住頹勢

配圖來自canva可畫 蘑菇街直播業務稍有起色,但發展前景一眼就能望到頭。近日,蘑菇街公布 雙十二 戰報資料顯示,今年 雙十二 蘑菇街平台直播gmv同比增長167.87 而這得益於蘑菇街主播的的亮眼戰績,雙十二 期間,蘑菇街2位頭部主播小甜心 葉子單場成交金額破億 12位中腰部主播成交金額破千萬,其...

蘑菇街內推,涼涼的一面新鮮出爐

1 自我介紹 2 專案 做了哪些事情 我說我做的專案大都一些介面,所以他就展開來問了我第三個問題 3 css布局方式,position的一些屬性 4 盒子模型 5 塊級元素和行塊級元素的區別,怎麼轉換 6 css3有什麼了解 7 js邏輯互動時,對閉包 作用域 原型 執行環境等的理解,執行環境的變數...

2014蘑菇街校招前端筆試題和我自己的解答

position static 元素框正常生成,塊級元素生成乙個矩形框,作為文件流的一部分,行內元素則會建立乙個或多個行框,置於其父元素中 position relative 元素框偏移某個距離,元素仍然保持位定位前的形狀,它原本所佔的空間仍然保留 position absolute 元素從文件流完...