SwiftUI中频繁更新@State/@Published值导致CPU占用过高问题求助

核心问题分析 #

直接用@State var offset: CGFloat绑定滚动偏移时，每一次滚动都会触发整个ZStack（包括列表和头部视图）的重绘。如果头部视图包含复杂布局或图层，频繁重绘会直接拉满CPU，导致滚动卡顿。Combine限流只能减少更新频率，但无法从根源避免不必要的重绘。

可行解决方案 #

1. 用PreferenceKey隔离偏移传递，避免全局重绘 #

通过PreferenceKey捕获滚动偏移，仅让头部视图响应偏移变化，列表本身不参与重绘：

// 定义偏好键传递滚动偏移
struct ScrollOffsetPreferenceKey: PreferenceKey {
    static var defaultValue: CGFloat = 0
    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {}
}

// 在列表中注入偏移监听
List {
    // 列表内容
}
.background(
    GeometryReader { proxy in
        Color.clear
            .preference(
                key: ScrollOffsetPreferenceKey.self,
                value: proxy.frame(in: .named("scrollView")).minY
            )
    }
)
.coordinateSpace(name: "scrollView")
.onPreferenceChange(ScrollOffsetPreferenceKey.self) { newOffset in
    viewModel.scrollOffset = newOffset
}

然后用EquatableView包装头部视图，同时让头部视图遵循Equatable，自定义相等判断逻辑，确保只有偏移变化到阈值时才触发重绘：

ZStack(alignment: .top) {
    List { /* ... */ }
    EquatableView(content: {
        HeaderView(offset: viewModel.scrollOffset)
    })
}

// 自定义头部视图的相等判断
struct HeaderView: View, Equatable {
    let offset: CGFloat
    
    static func == (lhs: Self, rhs: Self) -> Bool {
        // 仅当偏移差超过1pt时才认为需要更新
        abs(lhs.offset - rhs.offset) > 1.0
    }
    
    var body: some View {
        // 头部视图布局，根据offset实现动画
    }
}

2. 底层用UITableView代理获取偏移（性能最优） #

SwiftUI的List底层是UITableView，直接通过UIViewRepresentable封装，利用UITableViewDelegate的scrollViewDidScroll方法获取偏移，跳过SwiftUI原生的视图更新链路，性能更优：

struct CustomList: UIViewRepresentable {
    var content: () -> UIView
    var onScroll: (CGFloat) -> Void
    
    func makeUIView(context: Context) -> UITableView {
        let tableView = UITableView()
        tableView.delegate = context.coordinator
        // 配置tableView，添加自定义content视图
        return tableView
    }
    
    func updateUIView(_ uiView: UITableView, context: Context) {}
    
    func makeCoordinator() -> Coordinator {
        Coordinator(onScroll: onScroll)
    }
    
    class Coordinator: NSObject, UITableViewDelegate {
        var onScroll: (CGFloat) -> Void
        
        init(onScroll: @escaping (CGFloat) -> Void) {
            self.onScroll = onScroll
        }
        
        func scrollViewDidScroll(_ scrollView: UIScrollView) {
            onScroll(scrollView.contentOffset.y)
        }
    }
}

在SwiftUI视图中使用该自定义列表，将偏移传递给头部视图，配合EquatableView进一步优化重绘。

3. 动画触发条件优化 #

不要在每次offset变化时都触发动画，仅在偏移进入需要动画的区间（如下拉超过导航栏高度、上滑到顶部）时才启用动画：

.onPreferenceChange(ScrollOffsetPreferenceKey.self) { newOffset in
    let shouldAnimate = newOffset < -50 || newOffset > 0
    if shouldAnimate {
        withAnimation(.easeInOut(duration: 0.2)) {
            viewModel.scrollOffset = newOffset
        }
    } else {
        viewModel.scrollOffset = newOffset
    }
}

关键优化点总结 #

• 隔离重绘范围：让头部视图独立响应偏移变化，避免列表跟着重绘。
• 减少重绘频率：通过Equatable自定义相等逻辑，只在必要时更新头部视图。
• 选择高效的偏移获取方式：优先用UITableView代理，其次是PreferenceKey，避免直接绑定@State导致全局重绘。

内容的提问来源于stack exchange，提问作者Mohammad Yeganeh