2016-03-29 17 views
0

私はFacebook ComponentsKitを使用してビューを生成しています。ComponentKitとFLUXアーキテクチャ - 不要なUIの再レンダリングを避ける

私は現在、アプリケーションの状態を変更してビューの更新をトリガーするための「フラックス」アーキテクチャに移行しています。

主な問題は、すべての状態の変更がUIの更新を引き起こすわけではないということです。私はそれを避けるために "一般的な"メカニズムを理解していません。

基本的に、アプリケーション状態は、「ビューモデル」(ネイティブの型付きオブジェクトに解析される)を表す「大きな」「JSON」です。 JSONには、すべてのビュー宣言とその初期値が含まれています。

:私の「フラックス」抽象化がどのように見える

{ 
    ... views ... 
     { 
      "pager" : { 
       "id" : "pager-id-xxx", 
       "currentPage" : 0, 
       "pages" : [ 
         ....pages.... 
         {}, 
         {}, 
         ....pages.... 
       ] 
      }, 
      ... 
      "navigation-next-button" : { 
       "id" : "navigation-next-button-id-xxxx", 
       "target" : "pager-id-xxx" 
      } 
     }, 
    ... views ... 
} 

:「ページャ」成分とナビゲーションを含むビューの階層を表す単純化されたJSON「次へ」ボタン例えば

(JSONは非常に複雑です)私の "ビューコントローラ" では

// "Action" portion 
@interface ChangePageAction 

@property id destinationId; // very simplified action. wraps the destination "id" 

@end 

@implementation ChangePageReducer 

-(JSON)reduce:(JSON)initialJSON action:(ChangePageAction *)changePageAction { 
     // the "reduce" portion finds the node of the pager (in the JSON) and changes the value by +1 
     // something like: 
     // find the node in the JSON with the changePageAction.destinationID 
    Node *nodeCopy = getNodeCopy(initialJSON,changePageAction.destinationId); 
    replaceValue(nodeCopy,nodeCopy.currentPage + 1); 
    // according to FLUX doctrine we are supposed to return a new object 
    return jsonCopyByReplacingNode(nodeCopy); // a new JSON with the updated values 
} 

// the navigation button triggers the new state 
@implementation NavigationNextButton { 
    id _destination; // the target of this action 
    FluxStore _store; // the application flux store 
} 

-(void)buttonPressed { 
    ChangePageAction *changePage = ... 
    [_store dispatch:changePage]; 

} 
@end 

私は今、 "更新状態" のコールバックを取得

@implementation ViewController 

-(void)newState:(JSON)newJSON { 
    // here all of the view is re-rendered 
    [self render:JSON]; 


    //The issue is that I don't need or want to re-render for every action that is performed on the state. 
    // many states don't evaluate to a UI update 
    // how should I manage that? 
} 
@end 

答えて

2

残念ながら、これをComponentKitで簡単に行う方法はありません。 ReactはshouldComponentUpdateですが、ComponentKitには同等の機能がありません。

良いニュースは、ComponentKitはすべてのコンポーネントを再構築し、実際に何も変更されていないことを認識し、UIKitの変更を行わないようにすることです。

悪い知らせは、かなりの量のCPUを費やすということです。

+0

コンポーネントコントローラ(またはコンポーネント自体)が状態変更通知に加入していることは意味がありますか?あなたはこの問題についてどうやって行きますか? –

関連する問題