SwiftUI中如何展示超大量文本？

问题概述 #

当SwiftUI的Text组件尝试展示超大量文本（数千行级）时，会出现卡顿甚至完全无法渲染的情况。测试发现当字符数超过151480时就会触发该问题，即使通过UIViewRepresentable封装UITextView也无法直接解决。示例代码如下：

import SwiftUI

struct ContentView: View {
    let text = Array(repeating: lipsum, count: 500).joined(separator: "")

    var body: some View {
        ScrollView {
            VStack(alignment: .leading) {
                Text(text)
                    .lineLimit(nil)
                    .fixedSize(horizontal: false, vertical: true)
                    .multilineTextAlignment(.leading)
            }
        }
        .padding()
    }
}

let lipsum = """Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi laoreet elementum purus.
Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec posuere congue facilisis.
Aenean sed neque purus. Integer ornare pretium condimentum.
Cras vel ipsum et risus vulputate auctor non ac ligula.
Morbi in sagittis sapien. Aliquam bibendum efficitur pellentesque.
Aliquam erat volutpat. Pellentesque suscipit est sapien, id finibus quam sagittis at.
Duis augue quam, imperdiet ut erat quis, suscipit rutrum elit.
Pellentesque fringilla, nisi ut iaculis interdum, erat sapien auctor diam, nec eleifend orci massa ut neque.
Aenean accumsan, lorem eget finibus posuere, neque tortor hendrerit dui, sit amet tempus neque lectus at lorem.
Mauris convallis in nunc eget sollicitudin. Proin tincidunt diam ut vehicula feugiat.

"""

从日志可看到核心问题：

-[<_TtCOCV7SwiftUI11DisplayList11ViewUpdater8PlatformP33_65A81BD07F0108B0485D2E15DE104A7514CGDrawingLayer: 0x600000f65b60> display]:
Ignoring bogus layer size (361.000000, 209020.333333), contentsScale 3.000000, backing store size (1083.000000, 627061.000000)

原因分析 #

这并非SwiftUI的“固有限制”，而是Core Animation渲染层的尺寸阈值限制导致的：当文本渲染后的总高度过大时，对应的CALayer backing store尺寸超过了系统允许的最大值（不同设备/系统版本阈值略有差异），系统会直接忽略这个无效的渲染层，导致文本无法显示。

可行解决方案 #

1. 分段懒加载文本（推荐） #

将大文本拆分为多个小片段，使用LazyVStack按需渲染当前可见区域的文本段，避免一次性计算并渲染全部内容：

import SwiftUI

struct LargeTextView: View {
    let text: String
    // 按段落拆分文本，可根据需求调整拆分粒度
    private var textChunks: [String] {
        text.components(separatedBy: "\n\n")
    }

    var body: some View {
        ScrollView {
            LazyVStack(alignment: .leading, spacing: 8) {
                ForEach(textChunks.indices, id: \.self) { index in
                    Text(textChunks[index])
                        .multilineTextAlignment(.leading)
                }
            }
            .padding()
        }
    }
}

// 使用示例
struct ContentView: View {
    let text = Array(repeating: lipsum, count: 500).joined(separator: "")
    
    var body: some View {
        LargeTextView(text: text)
    }
}

let lipsum = """Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi laoreet elementum purus.
Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec posuere congue facilisis.
Aenean sed neque purus. Integer ornare pretium condimentum.
Cras vel ipsum et risus vulputate auctor non ac ligula.
Morbi in sagittis sapien. Aliquam bibendum efficitur pellentesque.
Aliquam erat volutpat. Pellentesque suscipit est sapien, id finibus quam sagittis at.
Duis augue quam, imperdiet ut erat quis, suscipit rutrum elit.
Pellentesque fringilla, nisi ut iaculis interdum, erat sapien auctor diam, nec eleifend orci massa ut neque.
Aenean accumsan, lorem eget finibus posuere, neque tortor hendrerit dui, sit amet tempus neque lectus at lorem.
Mauris convallis in nunc eget sollicitudin. Proin tincidunt diam ut vehicula feugiat.

"""

2. 优化UITextView封装方案 #

如果必须使用UITextView，需避免嵌套在SwiftUI的ScrollView中，让UITextView自身处理滚动，同时优化布局计算：

import SwiftUI
import UIKit

struct UITextViewWrapper: UIViewRepresentable {
    let text: String
    
    func makeUIView(context: Context) -> UITextView {
        let textView = UITextView()
        textView.isEditable = false
        textView.isScrollEnabled = true
        textView.textContainerInset = UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 16)
        textView.font = UIFont.systemFont(ofSize: 16)
        return textView
    }
    
    func updateUIView(_ uiView: UITextView, context: Context) {
        uiView.text = text
    }
}

// 使用示例
struct ContentView: View {
    let text = Array(repeating: lipsum, count: 500).joined(separator: "")
    
    var body: some View {
        UITextViewWrapper(text: text)
            .edgesIgnoringSafeArea(.all)
    }
}

let lipsum = """Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi laoreet elementum purus.
Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec posuere congue facilisis.
Aenean sed neque purus. Integer ornare pretium condimentum.
Cras vel ipsum et risus vulputate auctor non ac ligula.
Morbi in sagittis sapien. Aliquam bibendum efficitur pellentesque.
Aliquam erat volutpat. Pellentesque suscipit est sapien, id finibus quam sagittis at.
Duis augue quam, imperdiet ut erat quis, suscipit rutrum elit.
Pellentesque fringilla, nisi ut iaculis interdum, erat sapien auctor diam, nec eleifend orci massa ut neque.
Aenean accumsan, lorem eget finibus posuere, neque tortor hendrerit dui, sit amet tempus neque lectus at lorem.
Mauris convallis in nunc eget sollicitudin. Proin tincidunt diam ut vehicula feugiat.

"""

内容的提问来源于stack exchange，提问作者Claus Jørgensen