優化tableView滑動時出現卡的現象
阿新 • • 發佈：2019-02-10
然而在使用第三方應用時，卻經常遇到效能上的問題，普遍表現在滾動時比較卡，特別是table cell中包含圖片的情況時。
實際上只要針對性地優化一下，這種問題就不會有了。有興趣的可以看看 LazyTableImages這個官方的例子程式，雖然也要從網上下載圖片並顯示，但滾動時絲毫不卡。
下面就說說我對UITableView的瞭解。不過由於我也是初學者，或許會說錯或遺漏一些，因此僅供參考。
首先說下UITableView的原理。有興趣的可以看看 《About Table Views in iOS-Based Applications》。
UITableView是UIScrollView的子類，因此它可以自動響應滾動事件（一般為上下滾動）。
它 內部包含0到多個UITableViewCell物件，每個table cell展示各自的內容。當新cell需要被顯示時，就會呼叫tableView:cellForRowAtIndexPath:方法來獲取或建立一個 cell；而不可視時，它又會被釋放。由此可見，同一時間其實只需要存在一螢幕的cell物件即可，不需要為每一行建立一個cell。
此 外，UITableView還可以分為多個sections，每個區段都可以有自己的head、foot和cells。而在定位一個cell時，就需要2 個欄位了：在哪個section，以及在這個section的第幾行。這在iOS SDK中是用NSIndexPath來表述的，UIKit為其添加了indexPathForRow:inSection:這個建立方法。
其他諸如編輯之類的就不提了，因為和本文無關。
介紹完原理，接下來就開始優化吧。
實際上只要針對性地優化一下，這種問題就不會有了。有興趣的可以看看 LazyTableImages這個官方的例子程式，雖然也要從網上下載圖片並顯示，但滾動時絲毫不卡。
下面就說說我對UITableView的瞭解。不過由於我也是初學者，或許會說錯或遺漏一些，因此僅供參考。
首先說下UITableView的原理。有興趣的可以看看 《About Table Views in iOS-Based Applications》。
UITableView是UIScrollView的子類，因此它可以自動響應滾動事件（一般為上下滾動）。
它 內部包含0到多個UITableViewCell物件，每個table cell展示各自的內容。當新cell需要被顯示時，就會呼叫tableView:cellForRowAtIndexPath:方法來獲取或建立一個 cell；而不可視時，它又會被釋放。由此可見，同一時間其實只需要存在一螢幕的cell物件即可，不需要為每一行建立一個cell。
此 外，UITableView還可以分為多個sections，每個區段都可以有自己的head、foot和cells。而在定位一個cell時，就需要2 個欄位了：在哪個section，以及在這個section的第幾行。這在iOS SDK中是用NSIndexPath來表述的，UIKit為其添加了indexPathForRow:inSection:這個建立方法。
其他諸如編輯之類的就不提了，因為和本文無關。
介紹完原理，接下來就開始優化吧。
-
使用不透明檢視。
不透明的檢視可以極大地提高渲染的速度。因此如非必要，可以將table cell及其子檢視的opaque屬性設為YES（預設值）。
其中的特例包括背景色，它的alpha值應該為1（例如不要使用clearColor）；影象的alpha值也應該為1，或者在畫圖時設為不透明。 -
不要重複建立不必要的table cell。
前面說了，UITableView只需要一螢幕的UITableViewCell物件即可。因此在cell不可見時，可以將其快取起來，而在需要時繼續使用它即可。
而UITableView也提供了這種機制，只需要簡單地設定一個identifier即可：
值得一提的是，cell被重用時，它內部繪製的內容並不會被自動清除，因此你可能需要呼叫setNeedsDisplayInRect:或setNeedsDisplay方法。static NSString *CellIdentifier = @"xxx"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];if (cell == nil) { cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease]; }
此 外，在新增table cell的時候，如果不需要動畫效果，最好不要使用insertRowsAtIndexPaths:withRowAnimation:方法，而是直接調 用reloadData方法。因為前者會對所有indexPaths呼叫tableView:cellForRowAtIndexPath:方法，即便該 cell並不需要顯示（不知道是不是bug），這就可能建立大量多餘的cell。勘誤：只是在模擬器上測試如此，真機除錯時沒有這種bug。 -
減少檢視的數目。
UITableViewCell包含了textLabel、detailTextLabel和imageView等view，而你還可以自定義一些檢視放在它的contentView裡。然而view是很大的物件，建立它會消耗較多資源，並且也影響渲染的效能。
如果你的table cell包含圖片，且數目較多，使用預設的UITableViewCell會非常影響效能。奇怪的是，使用自定義的view，而非預定義的view，明顯會快些。
當然，最佳的解決辦法還是繼承UITableViewCell，並在其drawRect:中自行繪製：
不過這樣一來，你會發現選中一行後，這個cell就變藍了，其中的內容就被擋住了。最簡單的方法就是將cell的selectionStyle屬性設為UITableViewCellSelectionStyleNone，這樣就不會被高亮了。- (void)drawRect:(CGRect)rect { if (image) { [image drawAtPoint:imagePoint]; self.image = nil; } else { [placeHolder drawAtPoint:imagePoint]; } [text drawInRect:textRect withFont:font lineBreakMode:UILineBreakModeTailTruncation]; }
此 外還可以建立CALayer，將內容繪製到layer上，然後對cell的contentView.layer呼叫addSublayer:方法。這個例 子中，layer並不會顯著影響效能，但如果layer透明，或者有圓角、變形等效果，就會影響到繪製速度了。解決辦法可參見後面的預渲染影象。 -
不要做多餘的繪製工作。
在實現drawRect:的時候，它的rect引數就是需要繪製的區域，這個區域之外的不需要進行繪製。
例如上例中，就可以用CGRectIntersectsRect、CGRectIntersection或CGRectContainsRect判斷是否需要繪製image和text，然後再呼叫繪製方法。 -
預渲染影象。
你會發現即使做到了上述幾點，當新的影象出現時，仍然會有短暫的停頓現象。解決的辦法就是在bitmap context裡先將其畫一遍，匯出成UIImage物件，然後再繪製到螢幕，詳細做法可見《利用預渲染加速iOS裝置的影象顯示》。 -
不要阻塞主執行緒。
做到前幾點後，你的table view滾動時應該足夠流暢了，不過你仍可能讓使用者感到不爽。常見的現象就是在更新資料時，整個介面卡住不動，完全不響應使用者請求。
出現這種現象的原因就是主執行緒執行了耗時很長的函式或方法，在其執行完畢前，無法繪製螢幕和響應使用者請求。其中最常見的就是網路請求了，它通常都需要花費數秒的時間，而你不應該讓使用者等待那麼久。
解 決辦法就是使用多執行緒，讓子執行緒去執行這些函式或方法。這裡面還有一個學問，當下載執行緒數超過2時，會顯著影響主執行緒的效能。因此在使用 ASIHTTPRequest時，可以用一個NSOperationQueue來維護下載請求，並將其 maxConcurrentOperationCount設為2。而NSURLRequest則可以配合GCD來實現，或者使用NSURLConnection的setDelegateQueue:方法。
當然，在不需要響應使用者請求時，也可以增加下載執行緒數，以加快下載速度：
此外，自動載入更新資料對使用者來說也很友好，這減少了使用者等待下載的時間。例如每次載入50條資訊，那就可以在滾動到倒數第10條以內時，載入更多資訊：- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate { if (!decelerate) { queue.maxConcurrentOperationCount = 5; } } - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView { queue.maxConcurrentOperationCount = 5; } - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView { queue.maxConcurrentOperationCount = 2; }
還有一點要注意的就是當圖片下載完成後，如果cell是可見的，還需要更新影象：- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath { if (count - indexPath.row < 10 && !updating) { updating = YES; [self update]; } }// update方法獲取到結果後，設定updating為NO
最後還是前面所說過的insertRowsAtIndexPaths:withRowAnimation:方法，插入新行需要在主執行緒執行，而一次插入很多行的話（例如50行），會長時間阻塞主執行緒。而換成reloadData方法的話，瞬間就處理完了。NSArray *indexPaths = [self.tableView indexPathsForVisibleRows];for (NSIndexPath *visibleIndexPath in indexPaths) { if (indexPath == visibleIndexPath) { MyTableViewCell *cell = (MyTableViewCell *)[self.tableView cellForRowAtIndexPath:indexPath]; cell.image = image; [cell setNeedsDisplayInRect:imageRect]; break; } }// 也可不遍歷，直接與頭尾相比較，看是否在中間即可。