UICollectionView in UITableView Freezing while Scrolling

Question

I create 1 demo Project like Gaana Application and for that i have added UICollectionView inside multiple UITableViewCell and it works fine but when i scroll UITableView, UITableView not scrolling smoothly.

can you guys please help me to fix this. below is my code.

override func viewDidLoad() {
        super.viewDidLoad()

        self.tblVW.tableFooterView = UIView(frame: CGRect.zero)
        self.tblVW.separatorColor = UIColor.clear

        let trendingNib = UINib(nibName: "TrendingCell", bundle: nil)
        self.tblVW.register(trendingNib, forCellReuseIdentifier: "TrendingCell")

        let topChartNib = UINib(nibName: "TopChartCell", bundle: nil)
        self.tblVW.register(topChartNib, forCellReuseIdentifier: "TopChartCell")

        let madeForYouNib = UINib(nibName: "MadeForYouCell", bundle: nil)
        self.tblVW.register(madeForYouNib, forCellReuseIdentifier: "MadeForYouCell")

        let newReleaseNib = UINib(nibName: "NewReleaseCell", bundle: nil)
        self.tblVW.register(newReleaseNib, forCellReuseIdentifier: "NewReleaseCell")

        let featuredArtistNib = UINib(nibName: "FeaturedArtistCell", bundle: nil)
        self.tblVW.register(featuredArtistNib, forCellReuseIdentifier: "FeaturedArtistCell")

        let discoverNib = UINib(nibName: "DiscoverCell", bundle: nil)
        self.tblVW.register(discoverNib, forCellReuseIdentifier: "DiscoverCell")

        let editorsPickNib = UINib(nibName: "EditorsPickCell", bundle: nil)
        self.tblVW.register(editorsPickNib, forCellReuseIdentifier: "EditorsPickCell")

        let gaanaSpecialNib = UINib(nibName: "GaanaSpecialCell", bundle: nil)
        self.tblVW.register(gaanaSpecialNib, forCellReuseIdentifier: "GaanaSpecialCell")
    }

func numberOfSections(in tableView: UITableView) -> Int {
        return 8
    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        if indexPath.section == 0 {
            let cell:TrendingCell = self.tblVW.dequeueReusableCell(withIdentifier: "TrendingCell", for: indexPath) as! TrendingCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else if indexPath.section == 1 {
            let cell:TopChartCell = self.tblVW.dequeueReusableCell(withIdentifier: "TopChartCell", for: indexPath) as! TopChartCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else if indexPath.section == 2 {
            let cell:MadeForYouCell = self.tblVW.dequeueReusableCell(withIdentifier: "MadeForYouCell", for: indexPath) as! MadeForYouCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else if indexPath.section == 3 {
            let cell:NewReleaseCell = self.tblVW.dequeueReusableCell(withIdentifier: "NewReleaseCell", for: indexPath) as! NewReleaseCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else if indexPath.section == 4 {
            let cell:FeaturedArtistCell = self.tblVW.dequeueReusableCell(withIdentifier: "FeaturedArtistCell", for: indexPath) as! FeaturedArtistCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else if indexPath.section == 5 {
            let cell:DiscoverCell = self.tblVW.dequeueReusableCell(withIdentifier: "DiscoverCell", for: indexPath) as! DiscoverCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else if indexPath.section == 6 {
            let cell:EditorsPickCell = self.tblVW.dequeueReusableCell(withIdentifier: "EditorsPickCell", for: indexPath) as! EditorsPickCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
        else {
            let cell:GaanaSpecialCell = self.tblVW.dequeueReusableCell(withIdentifier: "GaanaSpecialCell", for: indexPath) as! GaanaSpecialCell

            cell.selectionStyle = UITableViewCellSelectionStyle.none

            cell.layoutSubviews()
            return cell
        }
    }

Below code is once of UITableViewCell code.

    class TrendingCell: UITableViewCell {

    @IBOutlet weak var trendingCollectionVW: UICollectionView!
    var arrData = [String]()
    override func awakeFromNib() {
        super.awakeFromNib()

        trendingCollectionVW.dataSource = self
        trendingCollectionVW.delegate   = self

        let trendingSongsNib = UINib(nibName: "TrendingSongCollectionCell", bundle: nil)
        trendingCollectionVW.register(trendingSongsNib, forCellWithReuseIdentifier: "TrendingSongCollectionCell")

    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }

//    override func layoutSubviews() {
//        super.layoutSubviews()
//        
//        self.layer.shouldRasterize = true
//        self.layer.rasterizationScale = UIScreen.main.scale
//    }
}

//MARK: - UICollectionView Delegate & DataSource
extension TrendingCell: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 10
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "TrendingSongCollectionCell", for: indexPath) as! TrendingSongCollectionCell

        cell.lblTItle.text = String.init(format: "Indexpath %d", indexPath.item)
        cell.imgVW.image = UIImage.init(named: String.init(format: "trendingSong%d", indexPath.item+1))
        //cell.layoutSubviews()
        return cell
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: (UIScreen.main.bounds.size.width - 15) / 2.9, height: 175)
    }

    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        print("You selected cell #\(indexPath.item)!")
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return UIEdgeInsetsMake(0, 5, 5, 5)
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return 5
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 5
    }
}

When i scroll any of UICollectionView inside UITableViewCell, Suddenly 15 to 20 MB memory increased.

Edit Here is demo Project Link : https://www.dropbox.com/s/k1vpdqn9moli9nw/Gaana.zip?dl=0 Any help will be appreciated. Thanks

Answer 1

you are creating nibs every time which is already reusable and calling layoutSubviews() in cellfor method will create this issue

you can do following changes to your code

let trendingSongsNib = UINib(nibName: "TrendingSongCollectionCell", bundle: nil)
cell.trendingCollectionVW.register(trendingSongsNib, forCellWithReuseIdentifier: "TrendingSongCollectionCell")

put this lines in your cell's awakeFromNib()

so it will register cell at the time of creating your tableviewcell

and stop calling cell.layoutSubviews()

Answer 2

Here are several things you are doing wrong.

Problems:

Creating the nib every time

    let trendingSongsNib = UINib(nibName: "TrendingSongCollectionCell", bundle: nil)

Registerring the nib in the wrong place

    cell.trendingCollectionVW.register(trendingSongsNib, forCellWithReuseIdentifier: "TrendingSongCollectionCell")

Even after registering you try to dequeue using different reusing identifier

    let cell:TrendingCell = self.tblVW.dequeueReusableCell(withIdentifier: "TrendingCell", for: indexPath) as! TrendingCell

Even if you successfully dequeue a cell, you create the nib again and again in each call

    let trendingSongsNib = UINib(nibName: "TrendingSongCollectionCell", bundle: nil)

As each time collection view get created, it loads the data

    // whole architecture is responsible for this, no particular code.

Solution

1. You can register the cell's @viewDidLoad or in the interface builder

2. Do not dynamically load nib, dequeue will automatically do it.