【swift】tableviewをスクロールした際のカクカクを解消したい

アプリ開発初心者です。
QItaのAPI から取得したデータをtableviewに表示させるアプリを作成しましたが、
tableviewをスクロールさせると画面がカクカクしてスムーズにスクロールできません。
「tableview　カクカク」で検索し、対処方法を調べましたがよく分かりませんでした。

tableviewの動きをスムーズにする方法をご教授お願いいたします。

swift
1
2import UIKit
3
4struct Qiita: Codable {
5    let title: String
6    let createdAt: String
7    let user: User
8    let url: String
9    
10    enum CodingKeys: String, CodingKey {
11        case title = "title"
12        case createdAt = "created_at"
13        case user = "user"
14        case url = "url"
15    }
16}
17struct User: Codable {
18    let name: String
19    let profileImageUrl: String
20    
21    enum CodingKeys: String, CodingKey {
22        case name = "name"
23        case profileImageUrl = "profile_image_url"
24    }
25}
26
27
28
29class ViewController: UIViewController {
30    
31    private let cellId = "cellId"
32    private var qiitas = [Qiita]()
33    let tableView: UITableView = {
34        let tv = UITableView()
35        return tv
36    }()
37    
38    
39    override func viewDidLoad() {
40        super.viewDidLoad()
41        
42        view.addSubview(tableView)
43        tableView.frame.size = view.frame.size
44        
45        tableView.delegate = self
46        tableView.dataSource = self
47        tableView.register(QiitaTableViewCell.self, forCellReuseIdentifier: cellId)
48        navigationItem.title = "Qitaの記事"
49        
50        getQiitaApi()
51        
52    }
53    private func getQiitaApi(){
54        guard let url = URL(string: "https://qiita.com/api/v2/items?page=1&per_page=20") else { return }
55        var request = URLRequest(url: url)
56        request.httpMethod = "GET"
57        
58        let task = URLSession.shared.dataTask(with: url) { (data, response, err) in
59            if let err = err {
60                print("情報の取得に失敗しました。", err)
61                return
62            }
63            if let data = data {
64                do {
65                    //                    let json = try JSONSerialization.jsonObject(with: data, options: .fragmentsAllowed)
66                    
67                    let qiita = try JSONDecoder().decode([Qiita].self, from: data)
68                    self.qiitas = qiita
69                    DispatchQueue.main.async {
70                        self.tableView.reloadData()
71                    }
72                    
73                    print("json: ", qiita)
74                } catch(let err) {
75                    print("情報の取得に失敗しました。:", err)
76                }
77            }
78        }
79        
80        task.resume()
81    }
82    
83}
84
85extension ViewController: UITableViewDelegate, UITableViewDataSource {
86    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
87        return 80
88    }
89    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
90        return qiitas.count
91    }
92    
93    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
94        let cell = tableView.dequeueReusableCell(withIdentifier: cellId, for: indexPath) as! QiitaTableViewCell
95        //        cell.backgroundColor = .red
96        cell.qiita = qiitas[indexPath.row]
97        
98        return cell
99    }
100    
101    
102}
103
104class QiitaTableViewCell: UITableViewCell {
105    
106    var qiita: Qiita? {
107        didSet {
108            bodyTextLabel.text = qiita?.title
109            let url = URL(string: qiita?.user.profileImageUrl ?? "")
110            do {
111                let data = try Data(contentsOf: url!)
112                let image = UIImage(data: data)
113                userImageView.image = image
114            }catch let err {
115                print("Error : \(err.localizedDescription)")
116            }
117        }
118    }
119    
120    let userImageView: UIImageView = {
121        let iv = UIImageView()
122        iv.contentMode = .scaleAspectFill
123        iv.translatesAutoresizingMaskIntoConstraints = false
124        iv.clipsToBounds = true
125        return iv
126    }()
127    
128    let bodyTextLabel: UILabel = {
129        let label = UILabel()
130        label.text = "something in here"
131        label.font = .systemFont(ofSize: 15)
132        label.translatesAutoresizingMaskIntoConstraints = false
133        return label
134    }()
135    
136    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
137        super.init(style: style, reuseIdentifier: reuseIdentifier)
138        
139        addSubview(userImageView)
140        addSubview(bodyTextLabel)
141        [
142            userImageView.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 10),
143            userImageView.centerYAnchor.constraint(equalTo: centerYAnchor),
144            userImageView.widthAnchor.constraint(equalToConstant: 50),
145            userImageView.heightAnchor.constraint(equalToConstant: 50),
146            
147            bodyTextLabel.leadingAnchor.constraint(equalTo: userImageView.trailingAnchor, constant: 20),
148            bodyTextLabel.centerYAnchor.constraint(equalTo: centerYAnchor),
149        ].forEach{ $0.isActive = true }
150        
151        userImageView.layer.cornerRadius = 50 / 2
152    }
153    
154    required init?(coder: NSCoder) {
155        fatalError("init(coder:) has not been implemented")
156    }
157}
158

Tomato45

2022/02/19 00:36

1. 「QItaのAPI から取得したデータを」とありますが、「QIta」とは何でしょうか？URLRequestの構文を見るからに、それは「Qiita」の間違えのように見えますが。 2. tableView(_:numberOfRowsInSection:)で返ってくる件数が何件かを記述した方が問題の起因がわかると思いますが？まず一度に20件か30件ずつqiitasに渡してみては？自分だったら「Swift UITableView infinite scrolling」とかで検索してみますけど。