Render Components

We have couple new components in ComponentKit that conform to the render protocol.

CKRenderComponent

• ReplacesCKCompositeComponent.
• Has a single child.
• No custom layout is allowed (same as CKCompositeComponent).
• Faster state updates support out-of-the-box
• For the majority of the cases, you should subclass from CKRenderComponent - same as the general recommendation to use CKCompositeComponent.

Interface

#import <ComponentKit/CKRenderComponent.h>
@interface MyRenderComponent : CKRenderComponent
+ (instancetype)newWithText:(NSString *)text;
@end

Constructor

• Creates the component itself only (no other components).
• Saves all the props (passing parameters) to iVars.

@implementation MyRenderComponent
{
  NSString *_text;
}
+ (instancetype)newWithText:(NSString *)text
{
  auto const c = [super new];
  if (c) {
    c->_text = text;
  }
  return c;
}

Render method

• This method responsible to create the component's child.
• It receives the state as a parameter (Only if there is an initial state).
• Might not be called if the component has been reused.

- (CKComponent *)render:(id)state
{
  const BOOL multiLine = [state boolValue];
  return multiLine
         ? [MultiLineTextComponent newWithText:text]
         : [SingleLineTextComponent newWithText:text];
}