12 Powerful SwiftUI Component

You should start using this component to improve your code

1. LazyVGrid and LazyHGrid

This might still be rarely used, but many people haven’t utilized it yet when developing apps with SwiftUI.

However, you’re probably already familiar with the use of ‘Lazy,’ such as ‘LazyVStack’ or ‘LazyHStack.’ The usage is quite similar.

2These allow you to create complex grid layouts with lazy loading, which is great for performance when displaying large datasets.

struct LazyGridExample: View {
    let columns = [
        GridItem(.flexible()),
        GridItem(.flexible()),
        GridItem(.flexible())
    ]
    
    var body: some View {
        ScrollView {
            LazyVGrid(columns: columns, spacing: 20) {
                ForEach(0..<50) { index in
                    Text("Item \(index)")
                        .frame(height: 50)
                        .frame(maxWidth: .infinity)
                        .background(Color.blue.opacity(0.2))
                        .cornerRadius(8)
                }
            }
            .padding()
        }
    }
}

Here the preview UI

Source by Author

2. ViewThatFits

Automatically selects the first child view that fits within available space, perfect for responsive designs.

ViewThatFits will choose the most appropriate view based on available space

import SwiftUI

struct ViewThatFitsExample: View {
    var body: some View {
        VStack {
            Text("ViewThatFits Example")
                .font(.title)
                .padding()
            
            ViewThatFits(in: .horizontal) {
                // First option (highest priority) - full view
                HStack {
                    Image(systemName: "star.fill")
                        .foregroundColor(.yellow)
                    Text("This is the complete text that will be displayed if there's enough space")
                    Image(systemName: "star.fill")
                        .foregroundColor(.yellow)
                }
                .padding()…