在tableView（_：cellForRowAt :)内部下载图像导致单元格不停闪烁

Question

i want the image downloaded lazily for each UITableViewCell on the method tableView(_:cellForRowAt:) . when the table view shows on the screen, it non-stops flashing on each cell and i can't scroll the tableView.

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

    cell.content.delegate = self
    cell.content.text = messages[row].content
    cell.date.text = messages[row].createdDateStrInLocal
    cell.messageOwner.text = messages[row].user

    self.fetchUserAvatar(avatarName: messages[row].user, handler: ({ img in
        cell.profileImageView.image = img
        tableView.reloadRows(at: [indexPath], with: .automatic)
    }))
    return cell
}

fileprivate func fetchUserAvatar(avatarName: String, handler: @escaping (UIImage) -> Void){
    guard !avatarName.isEmpty, let user = self.user, !user.isEmpty else { return }
        let url = URL(string: self.url + "/userAvatarURL")
        var request = URLRequest(url: url!)
        let body = "username=" + user + "&avatarName=" + avatarName
        request.httpMethod = "POST"
        request.setValue("application/x-www-form-urlencoded; charset=utf-8", forHTTPHeaderField: "Content-Type")
        request.httpBody =  body.data(using: .utf8)
        defaultSession.dataTask(with: request as URLRequest, completionHandler: { data, response, error in
            guard error == nil else {
                print(error!)
                return
            }
            if let httpResponse = response as? HTTPURLResponse, 200...299 ~= httpResponse.statusCode, let data = data, let urlStr = String(data: data, encoding: String.Encoding.utf8), urlStr != "NULL", urlStr.contains("http"), let url = URL(string: urlStr) {
                self.defaultSession.dataTask(with: url, completionHandler:{ data, respone, error in
                    guard error == nil else {
                        print(error!)
                        return
                    }
                    DispatchQueue.main.async {
                        if let httpResponse = response as? HTTPURLResponse, 200...299 ~= httpResponse.statusCode, let data = data, let img = UIImage(data: data) {
                            self.cacheImage.setObject(img, forKey: avatarName as NSString)
                            handler(img)
                        }
                    }
                }).resume()
            }
        }).resume()
}

Answer 1

Despite the fact the this is not a safe way to download image to cell, you need to remove tableView.reloadRows(at: [indexPath], with: .automatic) . This cause infinite loop.

And make sure you update constraint when image is updated.

Answer 2

For fetchUserAvatar make it in separate Background thread. In the completion block, get back to main thread and update table cell thumb image. Never reload table view inside `cellForRowAt indexPath: IndexPath.' Because it is already reloading cells.