title: Displaying image from database in TableView bugs
body: <p>I have a TableView and I am filling it with data retrieved from database. Everything works fine except the images. Because of the cell reuse behaviour, and I am fetching image in <code>cellForRowAtIndexPath</code>. I chose to fetch images in <code>cellForRowAtIndexPath</code> because in the details retrieving function (which is triggered in <code>viewDidLoad</code>), I need to do another request, which is causing other problems (reloading tableview before storing image url)</p>
  
  <p>The problem is that when I scroll fast, the resuable cells bugs while displaying user images</p>
  
  <pre><code>override func viewDidLoad() {
      super.viewDidLoad()
      fetchData()
  }
  
  var theUser = 
  
  func fetchData() {
     //.. after data is retrieved
  
     var innerDict = [String:String]()
  
     if let user = details.value![key] {
        if let name = user["name"] {
           // works
           innerDict["name"] = name
         }
  
        if let image = user["imageName"] {
         // gets the image name but at this point I need to;
         // a) retrieve the url here (with another call), which will eventually fail
         // to catch up with `innerDict` so `innerDict` won't contain `image` variable.
         // ie;
  
         myRef.downloadURLWithCompletion { (URL, error) -&gt; Void in }
  
        // b) Store the `image` name in innerDict and download image from url 
        // in `cellForRowAtIndexPath`. I chose this method:
  
          innerDict["image"] = image
        }
  
     user[id] = innerDict
     tableView.reloadData()
  }
  </code></pre>
  
  <p>Now the tableView as usual.</p>
  
  <pre><code>func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -&gt; UITableViewCell {
  
     let cell = ...
  
     // more stuff
  
     if let imageName = user["image"] {
        let storage = FIRStorage.storage()
        let storageRef = storage.referenceForURL("gs://bucket.com").child(user[id]).child(imageName)
  
        storageRef.downloadURLWithCompletion { (URL, error) -&gt; Void in
             if (error != nil) {
                // handle 
             } else {
                // I thought using Haneke would help to cache the image
                 cell.image.hnk_setImage(URL!)
             }
        }
   }
  </code></pre>
  
  <p>This is the closest one I could reach. However images bug on displaying when I scroll fast.</p>
  
  <hr>
  
  <p><strong>Edit:</strong></p>
  
  <p>I also tried using this approach but it's downloading the same image multiple times with this method, so it takes time for the same images to displayed. </p>
  
  <pre><code>islandRef.dataWithMaxSize(1 * 1024 * 1024) { (data, error) -&gt; Void in
    if (error != nil) {
      // Uh-oh, an error occurred!
    } else {
      let image: UIImage! = UIImage(data: data!)
      cell.userImage.hnk_setImage(image, key: "\(userID)")
    }
  }
  </code></pre>
  
  <p>However, with top approach the speed was very fast. The only problem of the above code was the glitch when I scroll fast.</p>
  
  <hr>
  
  <p><strong>Edit 2</strong></p>
  
  <pre><code> var images = [UIImage]()
  
   func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -&gt; UITableViewCell {
  
  let cell = tableView.dequeueReusableCellWithIdentifier("ItemCell", forIndexPath: indexPath) as! ItemDetailTableViewCell
  
  let item = items[indexPath.section][indexPath.row]
  
  if let uid = item["owner"] as? String {
     if let user = users[uid] {
        if let imageName = user["image"] { 
           if let img: UIImage = images[indexPath.row] {    // crash here "fatal error: Index out of range"
             cell.userImage.image = img
            }
        } else {
          let storage = FIRStorage.storage()
          let storageRef = storage.referenceForURL("gs://bucket").child(uid).child(imageName)
  
          storageRef.downloadURLWithCompletion { (URL, error) -&gt; Void in
             if (error != nil) {
  
              } else {
                 dispatch_async(dispatch_get_main_queue(), {
                       cell.userImage.hnk_setImageFromURL(URL!)
                       self.images[indexPath.row] = cell.image.image!
                 })
             }
           }
      }   
  }
  
  
  
  
  
  }    
  </code></pre>