large uitableview (1000 rows) freezes on reloadData()

Question

I have a UITableView with about 1000 rows. I also have a timer running every 6 seconds that fetches data from a web service. Each time I call reloadData() there is a blip - my app freezes very noticeably for a brief moment. This is very evident when scrolling. I tried fetching about 400 rows only and the blip disappears. Any tips how to get rid of this while still fetching the 1000 rows?

var items: [Item] = []

Timer.scheduledTimer(withTimeInterval: 6, repeats: true) { [weak self] _ in
   guard let strongSelf = self else { return }

   Alamofire.request(urlString, method: method, parameters: params) { response in
      // parse the response here and save it in array called itemsFromResponse
      OperationQueue.main.addOperation {
         strongSelf.items = itemsFromResponse
         strongSelf.itemsTableView.reloadData()
      }
   }
}

UITableViewDataSource code:

extension ItemViewController: UITableViewDataSource, UITableViewDelegate {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return items.count
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "itemCell", for: indexPath) 

        cell.textLabel?.text = items[indexPath.row].name

        return cell
    }
}

Run the time profiler to find what's taking the time. – Fogmeister Jul 19 '17 at 14:01 — Fogmeister, Jul 19 '17 at 14:01

score 2 · Accepted Answer · answered Jul 19 '17 at 14:10

The problem is being caused because you are storing the items from the response and then updating the table view from the same OperationQueue, meaning that the UI thread is being blocked while your array is being updated. Using an operation queue in itself is not an optimal way to schedule tasks if you do not need fine grain control over the task (such as cancelling and advanced scheduling, like you don't need here). You should instead be using a DispatchQueue, see here for more.

In order to fix your issue, you should update your array from the background completion handler, then update your table.

Timer.scheduledTimer(withTimeInterval: 6, repeats: true) { [weak self] _ in
   guard let strongSelf = self else { return }

   Alamofire.request(urlString, method: method, parameters: params) { response in
      // parse the response here and save it in array called itemsFromResponse
      strongSelf.items = itemsFromResponse
      // update the table on the main (UI) thread
      DispatchQueue.main.async {
         strongSelf.itemsTableView.reloadData()
      }
   }
}

You should also maybe look into a more efficient way to fetch new data, because reloading the entire dataset every 6 seconds is not very efficient in terms of data or CPU on the user's phone.

score -1 · Answer 2 · answered Jul 19 '17 at 14:10

The problem is you are reloading data every 6 seconds, so if the data is so big you're reloading 1000 rows every 6 seconds. I recommend you request the data and compare if there's new data so in that case you need to reload data or you simply ask to refresh once. For example:

var items: [Item] = []

Timer.scheduledTimer(withTimeInterval: 6, repeats: true) { [weak self] _ in
   guard let strongSelf = self else { return }

   Alamofire.request(urlString, method: method, parameters: params) { response in
      // parse the response here and save it in array called itemsFromResponse
      OperationQueue.main.addOperation {
         if(strongSelf.items != itemsFromResponse){
            strongSelf.items = itemsFromResponse
            strongSelf.itemsTableView.reloadData()
         }             
      }
  }

large uitableview (1000 rows) freezes on reloadData()

2 Answers2