SwiftUI List在MacOS中的性能优化示例

引言

List在iOS中有懒加载的特性，但是在MacOS中会一次性加载完List中的所有的数据。并没有懒加载的特性。

所以在MacOS的List中当数据量巨大时，会存在巨大的性能瓶颈。

  var body: some View {
    List(){
        ForEach(currentSectionModel) { (sectionModel) in
            Section(header:
                        HStack {
                Text("section")+Text(sectionModel.word).font(.title).foregroundColor(.red)
                        }.frame(height:35)
            ) {
              ForEach(currentSectionModel, id: \.self) { (wordModel) in
                  Text(wordModel.word)
                }
            }
        }
    }

当数据量达到15000条时， 在16寸i9的mbp上加载时长需要4.53s

这个时候建议使用 ScrollView + LazyVStack(macOS 11, iOS14支持)

ScrollView {
    LazyVStack {
    }
}

来获取巨大性能提升

  var body: some View {
    ScrollView {
        LazyVStack {
            ForEach(currentSectionModel) { (sectionModel) in
                Section(header:
                            HStack {
                    Text("section")+Text(sectionModel.word).font(.title).foregroundColor(.red)
                            }.frame(height:35)
                ) {
                  ForEach(currentSectionModel, id: \.self) { (wordModel) in
                      Text(wordModel.word)
                    }
                }
            }
        }
    }.onAppear {
        DispatchQueue.main.asyncAfter(deadline: .now() + 2.0) {
            currentSectionModel = storeData
        }
    }
}

实测加载15000 条数据加载时长为31ms 加载时长为原来的 0.0068倍。 因为只加载了显示的部分，所以性能提升巨大。

以上就是SwiftUI List在MacOS中的性能优化示例的详细内容，更多关于SwiftUI List性能优化MacOS的资料请关注我们其它相关文章！

赞 (0)

相关推荐

  • SwiftUI中TabView组件的常规使用

    SwiftUI中TabView组件的常规使用

    目录 前言 TabView常规用法1 TabView常规用法2 TabView常规用法3 TabView常规用法4---做轮播图 总结 前言 在UIKit中设置多个tabbar展示需要使用到UITabBarController 在SwiftUI中 由TabView组件来进行实现,同时TabView也可以实现PageViewController的效果, TabView常规用法1 import SwiftUI struct ZTMinePageView: View { var body: some

  • SwiftUI学习之state和Binding的区别浅析

    @state 绑定值的状态,其属性的修饰官方推荐使用private.上代码(ps:这里没用private 进行修饰,是为了演示区别) import SwiftUI struct FilterView: View { // @Binding var isFavorite: Bool @State var isFavorite = true var body: some View { Toggle(isOn: $isFavorite) { } let buttonTitle = isFavorite

  • 如何利用SwiftUI实现可缩放的图片预览器

    目录 前言 实现过程 程序的初步构想 显示 UIImage 双击缩放 放大手势缩放 预览任意 View 将 UIImage 从 LBJImagePreviewer 剥离 源码 总结 前言 在开发中,我们经常会遇到点击图片查看大图的需求.在 Apple 的推动下,iOS 开发必定会从 UIKit 慢慢向 SwiftUI 转变.为了更好地适应这一趋势,今天我们用 SwiftUI 实现一个可缩放的图片预览器. 实现过程 程序的初步构想 要做一个程序,首先肯定是给它起个名字.既然是图片预览器(Image

  • SwiftUI图片缩放、拼图等处理教程

    SwiftUI图片缩放、拼图等处理教程

    目录 前言 1.图片缩放 2.图片拼图 3.图片操作方法 4.示例代码 5.结尾 前言 采用SwiftUI Core Graphics技术,与C#的GDI+绘图类似,具体概念不多说,毕竟我也是新手,本文主要展示效果图及代码,本文示例代码需要请拉到文末自取. 1.图片缩放 完全填充,变形压缩 将图像居中缩放截取 等比缩放 上面三个效果,放一起比较好对比,如下 原图 - 完全填充,变形压缩 - 居中缩放截取 - 等比缩放 第1张为原图 第2张为完全填充,变形压缩 第3张为图像居中缩放截取 第4张为等

  • SwiftUI中级List如何添加新内容(2020年教程)

    功能说明 如何使用List循环显示array内容 .self 作为id的使用 如何更新List内容 TextField基础使用 代码 import SwiftUI struct ListAddItemView: View { @State var products = ["手机","电脑","水杯"] @State var pName:String = "" var body: some View { VStack{ Text

  • SwiftUI中@ViewBuilder的相关知识点解密

    SwiftUI中@ViewBuilder的相关知识点解密

    前言 在SwiftUI框架中使用很多的注解,虽然使语法看上去非常简洁,但是增加了初学者的理解难度,这篇文章我们来看一下@ViewBuilder的相关知识.主要包括以下内容: resultBuilder/functionBuilder是什么以及用法 ViewBuilder结构体 @ViewBuilder修饰符的用法 使用@ViewBuilder完成一个自定义视图 @resultBuilder注解 @resultBuilder是在Swift5.4添加的,之前是叫@_functionBuilder,在

  • SwiftUI List在MacOS中的性能优化示例

    引言 List在iOS中有懒加载的特性,但是在MacOS中会一次性加载完List中的所有的数据.并没有懒加载的特性. 所以在MacOS的List中当数据量巨大时,会存在巨大的性能瓶颈. var body: some View { List(){ ForEach(currentSectionModel) { (sectionModel) in Section(header: HStack { Text("section")+Text(sectionModel.word).font(.ti

  • Vue中的性能优化方案

    目录 减少响应式使用 1. 使用 computed 缓存计算结果 2. 本地化响应式变量 3. 函数式组件(Vue2) 减少 DOM 渲染压力 1. DOM 频繁切换展示的情况使用 v-show 2. keep-alive 缓存组件状态 3. 路由懒加载 4. 图片懒加载 5. 组件销毁时要清除定时器.EventListener 6. 列表使用唯一 key 减少打包体积 1. 开启 gzip 压缩 2. 按需引入第三方组件 最近使用 Vue 开发的过程中使用到一些对于性能有所提升的编码方式,所以

  • Java编程中的性能优化如何实现

    Java编程中的性能优化如何实现

      String作为我们使用最频繁的一种对象类型,其性能问题是最容易被忽略的.作为Java中重要的数据类型,是内存中占据空间比较大的一个对象.如何高效地使用字符串,可以帮助我们提升系统的整体性能. 现在,我们就从String对象的实现.特性以及实际使用中的优化这几方面来入手,深入理解以下String的性能优化. 在这之前,首先看一个问题.通过三种方式创建三个对象,然后依次两两匹配,得出的结果是什么?答案留到最后揭晓. String str1 = "abc"; String str2 =

  • 分享12个Vue开发中的性能优化小技巧(实用!)

    分享12个Vue开发中的性能优化小技巧(实用!)

    目录 前言 1.长列表性能优化 1.不做响应式 2.虚拟滚动 2.v-for遍历避免同时使用v-if 3.列表使用唯一key 4.使用v-show复用DOM 5.无状态的组件用函数式组件 6.子组件分割 7.变量本地化 8.第三方插件按需引入 9.路由懒加载 10.keep-alive缓存页面 11.事件的销毁 12.图片懒加载 总结 前言 性能优化,是每一个开发者都会遇到的问题,特别是现在越来越重视体验,以及竞争越来越激烈的环境下,对于我们开发者来说,只完成迭代,把功能做好是远远不够的,最重要

  • Wins2003系统中Apache性能优化方法

    为了满足网站高负荷的要求,在调整Apache参数时发现进程经常占用内存过多导致当机.经过不断的优化和修改参数组合,终于让服务器稳定 下来,可以满足大量访问的考验和应用要求.笔者总结了调试过程中的问题和解决办法如下,以供有类似需求的网管员参考(系统环境为Windows Server 2003和apache2.2.8): 1.http-mpm.conf设置 Apache的线程数控制文件为http-mpm.conf,在conf/exrtra目录下面,要使该配置文件起作用需要在httpd.conf 中将

  • Java中String性能优化

    不用使用String的构造函数,可能的话直接使用字符串. 两个特例: 1)想把char []转换为一个String, 2) 使用一个大的String对象的substring()方法: String.equals() 比 String.equalsIgnoreCase()要快: 尽量使用StringBuilder来构造一个String,而不是"+"操作符和String.concat() (除非是一个表达式,String s = a + b + c): StringBuilder是不同步的

  • Android中SparseArray性能优化的使用方法

    Android中SparseArray性能优化的使用方法

    之前一篇文章研究完横向二级菜单,发现其中使用了SparseArray去替换HashMap的使用.于是乎自己查了一些相关资料,自己同时对性能进行了一些测试.首先先说一下SparseArray的原理. SparseArray(稀疏数组).他是Android内部特有的api,标准的jdk是没有这个类的.在Android内部用来替代HashMap<Integer,E>这种形式,使用SparseArray更加节省内存空间的使用,SparseArray也是以key和value对数据进行保存的.使用的时候只

  • Django查询数据库的性能优化示例代码

    Django查询数据库的性能优化示例代码

    前言 Django数据层提供各种途径优化数据的访问,一个项目大量优化工作一般是放在后期来做,早期的优化是"万恶之源",这是前人总结的经验,不无道理.如果事先理解Django的优化技巧,开发过程中稍稍留意,后期会省不少的工作量. 现在有一张记录用户信息的UserInfo数据表,表中记录了10个用户的姓名,呢称,年龄,工作等信息. models文件 from django.db import models class Job(models.Model): title=models.Char

  • Vue性能优化的方法

    今天来谈一谈Vue中一些性能优化的问题,仅仅是个人使用中的一些小心得,来,今天我一句废话不多说,直接上内容好吧 1.v-if和v-show的使用, 我们都知道这两个都可以控制显隐,那我们用哪个呢,个人觉得要从两个方面入手来确定使用哪个, 1.权限的问题,只要涉及到权限相关的展示用v-if比较好 2.切换地频率,如果频繁的切换我们用v-show,不频繁的切换用v-if 其实两者各有优缺,就看你是怎么选择了,用v-if能减少页面中的DOM总数,加快渲染的速度,而且我们要清楚一个事情 v-if是'真正

  • react性能优化useMemo与useCallback使用对比详解

    react性能优化useMemo与useCallback使用对比详解

    目录 引言 对比 useMemo useCallback 引言 在介绍一下这两个hooks的作用之前,我们先来回顾一下react中的性能优化.在hooks诞生之前,如果组件包含内部state,我们都是基于class的形式来创建组件.当时我们也知道,react中,性能的优化点在于: 调用setState,就会触发组件的重新渲染,无论前后的state是否不同 父组件更新,子组件也会自动的更新 基于上面的两点,我们通常的解决方案是:使用immutable进行比较,在不相等的时候调用setState:在

随机推荐