Filter through large Array Swift

Question

I'm building a trip planning app that lets the user select a city from a local json file using a Picker.

The json file has 115K items and the UI freezes if I try to filter through this many items. Any suggestions on how to make this more efficient.

Any help would be greatly appreciated.

import SwiftUI

struct AddTripView: View {

    let cities = Bundle.main.decode([Destination].self, from: "cities.json")
    @State private var selectedCity = 0
    @State var searchText = ""

       var body: some View {
        
            Form {
                Section {
                    Picker(selection: $selectedCity, label: Text("Select city")) {
                        
                        SearchBar(text: $searchText)
 
                        ForEach(cities.filter {searchText.isEmpty ? true : $0.city.lowercased().hasPrefix(searchText.lowercased())}, id: \.self) {
                            
                            Text($0.city)
                        }
                    }
                }
            }.navigationBarTitle("Create trip")
            
        }
}

struct AddTripView_Previews: PreviewProvider {
    static var previews: some View {
        AddTripView()
    }
}

JSON example

[{
    "id": 1,
    "city": "Zaranj",
    "country": "Afghanistan"
  },
  {
    "id": 2,
    "city": "Taloqan",
    "country": "Afghanistan"
  },
  {
    "id": 3,
    "city": "Shīnḏanḏ",
    "country": "Afghanistan"
  },
  {
    "id": 4,
    "city": "Shibirghān",
    "country": "Afghanistan"
  },
  {
    "id": 5,
    "city": "Shahrak",
    "country": "Afghanistan"
  }]

There is an operator to represent `? true : `. Look at the bottom [here](https://github.com/apple/swift/blob/main/stdlib/public/core/Bool.swift); it's `||`. — , May 18 '21 at 04:29
Move the filtering to the background thread and show dummy data instead until the data is available. Maybe you can work with @State to know it's status — SwiftiSwift, May 18 '21 at 04:30
Many things: extract logic into view model, decode json once and in background, use debounce for entered search text (like in https://stackoverflow.com/a/66186675/12299030), perform filtering in background (like in https://stackoverflow.com/a/67135819/12299030), etc. — Asperi, May 18 '21 at 06:13
Import the json to read-only SQLite or Core Data repository is another option. A database is a very good fit for this since you have a lot of data and need to do filtering/searching — Joakim Danielson, May 18 '21 at 06:45

workingdog support Ukraine · Accepted Answer · 2021-05-18T10:00:29.177

do you really need a Picker? If not could you try this example. Let us know if the UI still struggles.

struct AddTripView: View {
    @State private var cities = [Destination]()
    @State private var selectedCity: Destination?
    @State private var searchQuery: String = ""
    
    var body: some View {
        VStack {
            Text("\(cities.count)")
            HStack {
                TextField("city search", text: $searchQuery).padding(5)
                    .overlay(RoundedRectangle(cornerRadius: 15).stroke(Color.blue, lineWidth: 1))
                    .foregroundColor(.blue)
                    .frame(width: 160)
                Button(action: {searchQuery = ""}) {
                    Image(systemName: "xmark.circle").font(.title)
                }
            }.padding(20)
            Divider()
            Text("Select city")

        ScrollView {
            LazyVStack (alignment: .leading) {
                ForEach(cities.filter{self.searchFor($0.city)}.sorted(by: { $0.city < $1.city })) { city in
                    Text("\(city.city)  \(city.country)")
                        .onTapGesture {
                            selectedCity = city
                            print("---> selectedCity: \(selectedCity?.city)")
                        }
                }
            }
        }.onAppear() {
                 cities = Bundle.main.decode([Destination].self, from: "cities.json")
            }
        }
    }
    
    private func searchFor(_ txt: String) -> Bool {
        return (txt.lowercased(with: .current).hasPrefix(searchQuery.lowercased(with: .current)) || searchQuery.isEmpty)
    }
}

struct Destination: Codable, Identifiable, Equatable {
    var id: Int
    var city: String
    var country: String
}

I've updated the code using ScrollView and LazyVStack instead of a List. It seems to be much more responsive. How is it for you? — workingdog support Ukraine, May 18 '21 at 09:13

Filter through large Array Swift

1 Answers1

Linked

Related