iOS 元件化實現的一些思路總結

aron1992發表於2019-04-04

元件化
元件化

背景

大概在一個月之前,公司有一個需求需要出一個功能和業務邏輯和當前應用相同的新版本,所有的UI重新設定過而不止是配色字型圖示等資訊的簡單修改。因為當時排期相對的不太緊,所有決定把整個專案做一個重構,為了實現更好的重構,發了點時間看了大概30多篇關於元件化的部落格和文章,也會把這些文章的連結貼在底部,然後動手開工了,今天有時間把這次重構過程中的一些想法總結下。

本文主要涉及到以下幾個主題:

  • 元件化遵循的原則
  • 元件化分層模型
  • 元件化整合方法

遵循原則

  • 高層依賴底層,下層不能對上層有依賴的關係
    這點是基本的設計原則,可以通過依賴倒置來設計。

  • 同層級的模組不依賴或者儘量少依賴
    這點同時也是基本的設計原則,可以通過控制反轉來設計,典型的就是使用觀察者模式來實現同一個層級模組的解耦。

  • 最小知識原則和自完備性
    一個獨立的模組儘量減少對其他低層模組的依賴,比如一個模組只是依賴低層模組的某個類的方法,不妨把這個方法拷貝到此模組中,如此一來這個模組就具有了更好的自完備性。

分層結構

分層模組圖2
分層模組圖2

圖片來源:58 同城 iOS 客戶端元件化演變歷程
以上圖來自網路,基本上可表述了元件化設計和實現的思路。

Ⅰ. 基礎底層元件
穩定的、和業務無關的元件,這一層就是傳說中的技術元件,這些元件在每個應用中基本都會存在,包含了:

  • 封裝基礎的網路操作
  • 資料庫
  • 日誌
  • 工具類:常用分類、巨集定義
  • 基礎UI元件
  • 快取管理模組
  • 其他第三方元件

底層元件-基礎網路庫

根據輸入輸出的思想進行封裝,封裝變化

不封裝的不變的部分:

  • 輸入引數中不變的HttpHeader
  • http層快取的處理
  • 二進位制資料轉換為JSON格式

輸入變化的部分包含:

  • url
  • 引數
  • 資料型別
  • 其他引數

輸出變化的部分包含了:

  • 回撥(JSON資料,錯誤碼,錯誤資訊)
  • 全域性的錯誤處理(傳送請求無網路處理,URL載入系統出錯的處理,業務錯誤的處理(授權失敗))

其中輸入輸出部分有的是可選的,除了定義一個全能的外部介面,需要提供若干個簡便外部介面提供個客戶端使用:

客戶端使用的是簡單的請求,只需要呼叫簡單外部介面傳遞 url引數 而不需要傳遞 資料型別其他引數資料型別其他引數 這兩個引數使用預設值即可。

客戶端關係返回資料的錯誤碼或者錯誤資訊,定義一個只包含錯誤碼,錯誤資訊回撥的簡單介面即可,而不傳遞JSON資料。

提供給上層的網路請求介面是不變的,使用者無需關心網路底層的具體邏輯實現,網路請求底層可以使用系統的URL載入系統,或者使用第三方的封裝不會到客戶端造成影響。

底層元件-工具類和常用巨集

巨集定義的分類

字串處理相關

  • 字串的空處理
  • 國際化格式字串巨集

物件處理相關

  • 物件模型序列化相關巨集
  • 物件的單例巨集

裝置資訊巨集:

  • 螢幕的尺寸、Tabbar高度、NavBar高度等巨集
  • ios版本巨集
  • iPad or iPhone 判斷巨集

DEBUG巨集

  • 自定義的Log巨集定義

顏色巨集定義

  • 十進位制RGB格式的顏色
  • 十六進位制HEX格式的顏色

巨集定義處理注意點

巨集定義避免和具體的類有互相依賴的關係
eg.
UtilMacro -> UIUtil -> UtilMacro

巨集定義有間接的依賴
eg.
ProductParameter -> UtilMacro -> UIUtil

常用的Category

  • UI系列:UIXXX-Category
    UIView/UIColor/UIImage/UILabel/UIImageView/UIViewController
  • NS系列:NSXXX-Category
    NSDate/NSObject/NSData/NSString/NSDictionary

底層元件-資料庫模組

資料庫的使用在應用中很常見,主要需要實現以下功能:

  • 資料庫管理者提供外部訪問資料庫的介面
  • 資料庫管理者擁有包含但是不限於資料庫自動版本升級處理的功能

具體可以參考iOS 資料庫升級資料遷移解決方案

底層元件-基礎UI元件

基礎的UI元件適用於所有的業務場景的並且支援擴充套件的UI元件,業務的變化,基礎UI元件不能有改動但是可以進行擴充套件和定製,常用的主要有以下:

  • 上下拉重新整理元件
  • 輪播元件
  • HUD提示元件
  • 滑動返回元件
  • 分頁元件
  • 自定義Tab元件

底層元件-快取管理模組

快取管理有很多的應用場景,比如快取頁面列表、詳情頁的資料,提高載入資料以達到優化使用者體驗,需要關注以下幾個方面:

  • 快取儲存策略 快取資料儲存的位置以及快取儲存的名稱
  • 快取儲存方式 物件歸檔儲存,資料庫儲存,二進位制儲存,
  • 快取的查詢和取出
  • 快取更新和過期處理
  • 提供客戶端的讀寫介面
  • 提供客戶端清除快取的介面

Ⅱ. 基礎業務層元件
相對穩定的資料提供層,資料提供包含了業務介面或者有包含了快取讀寫的服務,這一層就是傳說中的業務服務層元件,包含了:

  • 網路介面的封裝(針對業務的,可以包含有資料的快取讀寫功能)
  • IMSDK的封裝層元件
  • 第三方分享、登入、支付元件
  • 統計打點元件
  • 推送通知元件

業務元件-介面的封裝

介面的封裝提供給上層(一般是表現層)提供資料,中心化的網路介面設計,提供的是一個模型物件給上層
更詳細的網路層設計可參考:iOS應用架構談 網路層設計方案

業務元件-第三方分享、登入、支付元件

提供第三方分享、登入、支付的服務,可以擴充套件自定義的第三方元件,提供以下功能

業務元件-推送通知元件

推送通知在很多業務場景中都有用到,一般滴你的產品有運營管理,推送通知是必須的功能。一個推送管理元件一般包含以下功能:

  • 在App啟動時候初始化推送通知的設定
  • 處理註冊Token
  • 處理接收訊息
  • 提供給外部推送訊息資料的介面(可以設計為觀察者模式,客戶端是Observer)

業務元件-統計打點元件

統計打點也是在很多app(基本所有)中有使用到的,如果沒有和業務相關的打點統計、頁面統計,最基本的使用者新增、流程、日活等基本的資料都依賴於統計打點元件。此外一般的統計打點元件都有crash收集系統,所以這同時是一個很好的BUG反饋工具。統計打點元件一般的有以下功能:

  • 註冊第三方統計平臺的key,可多次註冊多個平臺
  • 一組統計介面提供給客戶端呼叫

整合方法

整合方法可以選擇主流的cocoapods,cocoapods提供的包管理功能十分強大,在開發階段,可以選擇開發庫,即把podfile中的某個pod指向為本地podspec檔案,這樣方便修改。如果庫完善的很好了,可以考慮把庫做成私有庫提交到自己的git系統以供其他專案和其他成員使用,因為篇幅限制,後續會寫一篇使用cocoapods做開發庫和私有庫整合的文章。

使用cocoapods整合實戰演練可以看我的這篇文章: iOS 元件化-使用cocoapods整合實戰演練

結束

以上就是我在一次專案元件化重構中總結的一些心得,希望可以對需要的人有所幫助,不妥之處敬請指教。

參考文章連結

以下連結是來自於我的書籤
iOS應用架構談 元件化方案 - Casa Taloyum
iOS元件化方案調研 - 簡書
蘑菇街 App 的元件化之路 - Limboy's HQ
做一個 App 前需要考慮的幾件事 - Limboy's HQ
淺析 iOS 應用元件化設計
糯米移動元件架構演進之路 - CSDN部落格
iOS應用架構談 元件化方案 - Casa Taloyum
餓了麼移動APP的架構演進 - SDK.CN - 中國領先的開發者服務平臺
滴滴出行iOS客戶端架構演進之路
iOS元件化思路-大神部落格研讀和思考 - 簡書
基於 CocoaPods 和 Git 的 iOS 工程元件化實踐
淺析 iOS 應用網路層設計
blog.cnbluebox.com/blog/2015/1…
iOS元件化實踐方案-LDBusMediator煉就 - 簡書
使用Cocoapods建立私有podspec - GeekerProbe
cocoapods程式碼管理 - 劉坤的技術部落格
元件化與模組化之路 - 簡書
Pods依賴庫快速開發入門 - 簡書
CocoaPods Guides - Podspec Syntax Reference v1.2.0.beta.1
iOS開發——元件化及去Mode化方案 - 簡書
iOS架構學習篇——元件化架構漫談 - 簡書
iOS應用架構談 元件化方案 - 簡書
Cocoapods使用私有庫中遇到的坑 - 簡書
大話大前端時代(一) —— Vue 與 iOS 的元件化 - 簡書
Create private pods framework with Cocoapods #iOS #cocoapods · shaokanp/seekrtech_docs Wiki
手機淘寶客戶端架構探索實踐-部落格-雲棲社群-阿里雲
Examples of specifications · kylefleming/CocoaPods Wiki
ios - Cocoapods dependency in pod spec not working - Stack Overflow
手機淘寶的客戶端架構探索之路 - CSDN部落格
微信、陌陌等著名IM軟體設計架構詳解 - CSDN部落格
架構 白話軟體設計中的六大原則 - zuochunsheng的部落格 - CSDN部落格
微信的軟體設計使用思考 - CSDN部落格
APP和服務端-架構設計(一) - CSDN部落格
手機淘寶構架演化實踐及優化 - CSDN部落格
淘寶網技術架構介紹 - CSDN部落格
App架構經驗總結 - CSDN部落格
IOS-元件化架構漫談 - CSDN部落格
iOS開發——元件化及去Mode化方案 - 簡書
58 同城 iOS 客戶端元件化演變歷程-極客

相關文章