怎么去掉wordpress底部,湖南seo网站多少钱,wordpress网站统计代码,电子商务网站建设解决方案一、长列表优化概述 列表是应用开发中最常见的一类开发场景#xff0c;它可以将杂乱的信息整理成有规律、易于理解和操作的形式#xff0c;便于用户查找和获取所需要的信息。应用程序中常见的列表场景有新闻列表、购物车列表、各类排行榜等。随着信息数据的累积#xff0c;特…一、长列表优化概述 列表是应用开发中最常见的一类开发场景它可以将杂乱的信息整理成有规律、易于理解和操作的形式便于用户查找和获取所需要的信息。应用程序中常见的列表场景有新闻列表、购物车列表、各类排行榜等。随着信息数据的累积特别是一些新闻应用、购物应用、聊天应用列表数据往往会达到上万条针对这类大量数据加载的长列表应用如何对长列表的性能进行优化是非常重要的。一个正确、高性能的长列表应用能明显降低列表渲染时间、提升页面的滑动帧率、降低应用内存占用大幅提升用户体验。
二、优化手段 1、懒加载 提供列表数据按需加载能力解决一次性加载长列表数据耗时长、占用过多资源的问题可以提升页面响应速度。 1ForEach ForEach循环渲染的过程如下 a、从列表数据源一次性加载全量数据 b、为列表数据的每一个元素都创建对应的组件并全部挂载在组件树上。即ForEach遍历多少个列表元素就创建多少个ListItem组件节点并依次挂载在List组件树根节点上 c、列表内容显示时只渲染屏幕可视区内的ListItem组件可视区外的ListItem组件滑动进入屏幕内时因为已经完成了数据加载和组件创建挂载直接渲染即可 如果列表数据较少数据一次性全量加载不是性能瓶颈时可以直接使用ForEach但是当数据量大、组件结构复杂的情况下ForEach会出现性能瓶颈。这是因为要一次性加载所有的列表数据创建所有组件节点并完成组件树的构建在数据量大时会非常耗时从而导致页面启动时间过长。另外屏幕可视区外的组件虽然不会显示在屏幕上但是仍然会占用内存。在系统处于高负载的情况下更容易出现性能问题极限情况下甚至会导致应用异常退出。 2LazyForEach LazyForEach懒加载的原理和渲染过程如下 a、LazyForEach会根据屏幕可视区能够容纳显示的组件数量按需加载数据 b、根据加载的数据量创建组件挂载在组件树上构建出一棵短小的组件树。即屏幕可以展示多少列表项组件就按需创建多少个ListItem组件节点挂载在List组件树根节点上 c、 屏幕可视区只展示部分组件。当可视区外的组件需要在屏幕内显示时需要从头完成数据加载、组件创建、挂载组件树这一过程直至渲染到屏幕上 LazyForEach实现了按需加载针对列表数据量大、列表组件复杂的场景减少了页面首次启动时一次性加载数据的时间消耗减少了内存峰值。不过在长列表滑动的过程中因为需要根据用户的滑动行为不断地加载新的内容这需要进行额外的数据请求和处理会增加滑动时的计算量从而对性能产生一定的影响。然而合理使用LazyForEach的按需加载能力通过在滑动停止或达到某个阈值时才进行加载可以减少不必要的计算和请求从而提高性能给用户带来更好的体验。总之在实现按需加载的场景中需要综合考虑性能和用户体验的平衡合理地优化加载逻辑和渲染方式以提升整体的性能表现。 2、缓存列表项 提供屏幕可视区域外列表项长度的自定义调节能力配合懒加载设置可缓存列表项参数通过预加载数据提升列表滑动体验。 LazyForEach懒加载可以通过设置cachedCount来指定缓存数量在设置cachedCount后除屏幕内显示的ListItem组件外还会预先将屏幕可视区外指定数量的列表项数据缓存。这样当一个屏幕数据加载完成后再次向下滑动时会先加载上一次请求的数据加载完成后再加载本次请求的数据。LazyForEach添加了cachedCount缓存列表项后其渲染过程如下 a、首先请求ncachedCount条数据并在屏幕上显示n条数据 b、当列表滑动缓存列表项需要从屏幕可视区外进入可视区内时此时只用渲染组件即可相比不设置cachedCount提升了显示效率 c、当列表不断滑动屏幕可视区外缓存的列表项数量少于cachedCount设置数量时会触发列表项数据加载事件继续预加载下一组缓存列表项cachedCount个 d、当上滑下滑间隔进行时列表两个方向分别缓存cachedCount条数据 e、如果不显式设置cachedCountcachedCount默认为1 缓存列表项适合加载列表项数据请求比较耗时的场景。比如滑动列表中含有短视频、高清图片等数据量比较大的资源可以通过预先从网络加载并缓存相关数据缩短渲染前的准备时间提升列表响应速度。 使用限制为缓存列表项仅在使用LazyForEach懒加载时有效ForEach循环渲染会一次性加载全量数据故无法也不需要设置缓存列表项。 3、动态预加载 根据历史任务加载耗时情况动态调整屏幕可视区域外数据预取数量配合懒加载设置可在列表不断滑动时屏幕可视区外实时更新列表数据通过预取和预渲染数据提升列表滑动体验。 HarmonyOS提供了内容预取的能力Prefetcher支持应用动态自适应网络状态通过提前下载一些图片或资源确保相关资源在需要时能立即显示以尽可能减少白块出现的概率。 LazyForEach懒加载可以通过使用Prefetcher来预取和预渲染数据。在使用Prefetcher后除屏幕内显示的ListItem组件外还会预先将屏幕可视区外的部分列表项数据进行预渲染和预取。这样当列表向下滑动时会先显示预渲染组件屏幕可视区外会动态调整预取范围。预取逻辑在Prefetcher的BasicPrefetcher类中实现BasicPrefetcher支持预取和预渲染图像解码、添加到组件树等过程分离、自适应调整预获取范围、优先加载可视区域、以及取消不必要任务快速滚动列表的场景下智能取消不必要任务其渲染过程如下 a、首先请求n条数据并在屏幕上显示m条数据 b、当列表滑动缓存列表项需要从屏幕可视区外进入可视区内时此时显示预渲染组件屏幕可视区外会动态调整预取范围相比仅设置cachedCount提升了显示效率 c、当列表不断滑动屏幕可视区外实时更新列表项、更新预取数据和预渲染数据 动态预加载适合加载列表项数据请求比较耗时的场景。 4、组件复用 提供可复用组件对象的缓存资源池通过重复使用已经创建过并缓存的组件对象降低相同组件短时间内频繁创建和销毁的开销提升组件渲染效率。 HarmonyOS应用框架提供了组件复用能力可复用组件从组件树上移除时会进入到一个回收缓存区。后续创建新组件节点时会复用缓存区中的节点节约组件重新创建的时间。尤其在列表等场景下其自定义子组件具有相同的组件布局结构列表更新时仅有状态变量等数据差异。通过组件复用可以提高列表页面的加载速度和响应速度。 组件复用机制如下 a、标记为Reusable的组件从组件树上被移除时组件和其对应的JSView对象都会被放入复用缓存中 b、当列表滑动新的ListItem将要被显示List组件树上需要新建节点时将会从复用缓存中查找可复用的组件节点 c、找到可复用节点并对其进行更新后添加到组件树中。从而节省了组件节点和JSView对象的创建时间 组件复用生效的条件是 1自定义组件被Reusable装饰器修饰即表示其具备组件复用的能力 2在一个自定义父组件下创建出来的具备组件复用能力的自定义子组件在可复用自定义组件从组件树上移除之后会被加入到其自定义父组件的可复用节点缓存中 3在一个自定义父组件下创建可复用的子组件时若其父自定义组件的可复用节点缓存中有对应类型的可复用子组件会通过更新可复用子组件的方式快速创建可复用子组件 4 ForEach循环渲染会一次性加载全量数据因此不支持组件复用 若业务实现中存在以下场景并成为UI线程的帧率瓶颈推荐使用组件复用 1列表滚动当应用需要展示大量数据的列表并且用户进行滚动操作时频繁创建和销毁列表项的视图可能导致卡顿和性能问题。在这种情况下使用列表组件的组件复用机制可以重用已经创建的列表项视图提高滚动的流畅度 2动态布局更新如果应用中的界面需要频繁地进行布局更新例如根据用户的操作或数据变化动态改变视图结构和样式重复创建和销毁视图可能导致频繁的布局计算影响帧率。在这种情况下使用组件复用可以避免不必要的视图创建和布局计算提高性能 3地图渲染在地图渲染这种场景下频繁创建和销毁数据项的视图可能导致性能问题。使用组件复用可以重用已创建的视图只更新数据的内容减少视图的创建和销毁能有效提高性能 5、布局优化 使用扁平化布局方案减少视图嵌套层级和组件数避免过度绘制提升页面渲染效率。 列表不同于其他布局包含了大量重复循环的ListItem所以对每一个ListItem的布局优化格外重要。错误的布局方式可能会导致组件树和嵌套层数过多在创建和布局绘制阶段产生较大的性能开销导致界面卡顿。合理使用布局减少嵌套层数能提高布局效率。
