UITableView slow, even with just a few objects?

Question

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.tableView setRowHeight:100];
    [self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];
    [self.view setBackgroundColor:[UIColor groupTableViewBackgroundColor]];
}


#pragma mark -
#pragma mark Table view data source

// Customize the number of sections in the table view.
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
}


// Customize the number of rows in the table view.
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 3;
}


// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

    static NSString *CellIdentifier = @"Cell";

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithFrame:CGRectMake(0, 0, 320, 100) reuseIdentifier:CellIdentifier] autorelease];

        // For Name/Phone: 
        UITextField *name = [[[UITextField alloc] initWithFrame:CGRectMake(75, 22, 200, 25)] autorelease];
        [name setFont:[UIFont systemFontOfSize:14]];
        [name setPlaceholder:@"John Doe"];
        [name setReturnKeyType:UIReturnKeyDone];
        [name setAutocapitalizationType:UITextAutocapitalizationTypeWords];
        [name setAutocorrectionType:UITextAutocorrectionTypeNo];
        [name setContentVerticalAlignment:UIControlContentVerticalAlignmentCenter];

        UITextField *phone = [[[UITextField alloc] initWithFrame:CGRectMake(75, 67, 200, 25)] autorelease];
        [phone setFont:[UIFont systemFontOfSize:14]];
        [phone setPlaceholder:@"0412 123 123"];
        [phone setReturnKeyType:UIReturnKeyDone];
        //[phone setKeyboardType:UIKeyboardTypePhonePad];
        [phone setContentVerticalAlignment:UIControlContentVerticalAlignmentCenter];

        UIImageView *background = [[[UIImageView alloc] initWithFrame:CGRectMake(9, 11, 302, 89)] autorelease];
        background.image = [UIImage imageNamed:@"book-personaldetailsbg.png"];

        // Add to the View
        [cell addSubview:background];
        [cell addSubview:name];
        [cell addSubview:phone];

        // Add actions:
        [name addTarget:self action:@selector(textFieldDone:) forControlEvents:UIControlEventEditingDidEndOnExit]; 
        [phone addTarget:self action:@selector(textFieldDone:) forControlEvents:UIControlEventEditingDidEndOnExit]; 

    }

    return cell;
}

Is there a reason for this? I only have a few objects set up so I can hardly see why it would be lagging. It jumps, and its not my phone because the settings app works fine.

Answer 1

UITableViewCells with many subviews are slow to render on the iPhone because of the way the phone renders each layer.

Read this: http://blog.atebits.com/2008/12/fast-scrolling-in-tweetie-with-uitableview/

The information in the above post is still hugely relevant and helpful, but the example project download link is broken (as of Dec 8th 2011). However, Apple's own table view documentation has had examples of flat table cells for fast scrolling for a log while now. Check it out: http://developer.apple.com/library/ios/#samplecode/AdvancedTableViewCells/Introduction/Intro.html

The main points are:

• The iPhone doesn't handle Alpha very quickly
• Subviews should have their opaque property set to YES
• If possible, draw your subviews into a single opaque view for best performance.

Obviously, cells with controls that need to be manipulated can't be flattened, so I think you'll just have to try and get away with making sure your cell subviews are opaque.

The last thing I would suggest is to not allocate new objects every time a cell is requested - this is certainly a bottleneck in your code. You should use reusable cells, and subclass a cell so that its fields are allocated and added as subviews only the first time they are created. Subsequent calls should dequeue the cell and use prepareForReuse to clear its old values.