为什么 React Native 中用 Animated 改变 width/height 无法走原生驱动,代价是什么?
为什么 React Native 中用 Animated 改变 width/height 无法走原生驱动,代价是什么? 本文先给出可直接复述的结论,再用最小代码说明Animated 布局动画 width 原生驱动 不支持的工作方式、判断依据、项目边界和常见误区。
列表与性能专题面试题第 1 页,显示第 1–46 题,共找到 46 道完整解析,可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
为什么 React Native 中用 Animated 改变 width/height 无法走原生驱动,代价是什么? 本文先给出可直接复述的结论,再用最小代码说明Animated 布局动画 width 原生驱动 不支持的工作方式、判断依据、项目边界和常见误区。
React Native 列表项入场动画为什么容易和 FlatList 虚拟化冲突? 本文先给出可直接复述的结论,再用最小代码说明FlatList item 入场动画 复用 冲突的工作方式、判断依据、项目边界和常见误区。
React Native Animated 的 useNativeDriver 把什么工作移出了 JS 线程,支持哪些属性? 本文先给出可直接复述的结论,再用最小代码说明Animated useNativeDriver 原生驱动 支持属性的工作方式、判断依据、项目边界和常见误区。
React Native 中每帧 setState 驱动动画为什么是反模式? 本文先给出可直接复述的结论,再用最小代码说明React Native setState 动画 每帧 反模式的工作方式、判断依据、项目边界和常见误区。
React Native 应用冷启动慢,应如何分阶段定位是原生初始化还是 JS 执行耗时? 本文先给出可直接复述的结论,再用最小代码说明React Native 冷启动 性能定位的工作方式、判断依据、项目边界和常见误区。
React Native 中频繁的桥(Bridge)通信为什么成为性能瓶颈? 本文先给出可直接复述的结论,再用最小代码说明React Native Bridge 瓶颈 序列化的工作方式、判断依据、项目边界和常见误区。
为什么 React Native 线上包中残留 console.log 会造成可感知的性能损耗? 本文先给出可直接复述的结论,再用最小代码说明React Native console.log 性能 线上移除的工作方式、判断依据、项目边界和常见误区。
社区常见替代方案(如 Flash List)相对 React Native FlatList 解决的核心问题是什么? 本文先给出可直接复述的结论,再用最小代码说明FlatList 替代 Flash List 回收复用的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 快速滚动出现白屏(blank cells)该如何定位与解决? 本文先给出可直接复述的结论,再用最小代码说明FlatList 快速滚动白屏 blank cells的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的 extraData 解决的是什么更新失效问题? 本文先给出可直接复述的结论,再用最小代码说明FlatList extraData 选中态不更新的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的 initialNumToRender 设置过小或过大各有什么后果? 本文先给出可直接复述的结论,再用最小代码说明FlatList initialNumToRender 首屏的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 为什么建议固定行高或使用 getItemLayout? 本文先给出可直接复述的结论,再用最小代码说明FlatList getItemLayout 固定行高的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的 keyExtractor 为什么影响列表更新性能与正确性? 本文先给出可直接复述的结论,再用最小代码说明FlatList keyExtractor key 稳定性的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的 maxToRenderPerBatch 与 updateCellsBatchingPeriod 如何配合控制滚动流畅度? 本文先给出可直接复述的结论,再用最小代码说明FlatList maxToRenderPerBatch updateCellsBatchingPeriod的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的列表项为什么应该做成纯组件并避免行内匿名回调? 本文先给出可直接复述的结论,再用最小代码说明FlatList renderItem 重渲染 PureComponent的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的 removeClippedSubviews 什么时候有用、什么时候会导致内容消失? 本文先给出可直接复述的结论,再用最小代码说明FlatList removeClippedSubviews bug的工作方式、判断依据、项目边界和常见误区。
React Native 中父组件状态频繁变化导致整个 FlatList 重渲染该怎么治理? 本文先给出可直接复述的结论,再用最小代码说明FlatList 父组件状态 重渲染的工作方式、判断依据、项目边界和常见误区。
React Native 中长列表为什么应该用 FlatList 而不是 ScrollView? 本文先给出可直接复述的结论,再用最小代码说明FlatList vs ScrollView 性能的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的窗口化(windowing)机制是怎样工作的? 本文先给出可直接复述的结论,再用最小代码说明FlatList windowSize 虚拟化 窗口化的工作方式、判断依据、项目边界和常见误区。
React Native 性能优化中 60fps 的帧预算意味着什么,JS 帧与 UI 帧有何区别? 本文先给出可直接复述的结论,再用最小代码说明React Native 60fps 帧预算 JS frame UI frame的工作方式、判断依据、项目边界和常见误区。
React Native 手势跟手动画要保证 60fps,关键约束是什么? 本文先给出可直接复述的结论,再用最小代码说明React Native 手势动画 60fps 掉帧的工作方式、判断依据、项目边界和常见误区。
React Native 横向卡片列表如何用 FlatList 实现吸附滚动且不掉帧? 本文先给出可直接复述的结论,再用最小代码说明FlatList 横向 snapToInterval 吸附的工作方式、判断依据、项目边界和常见误区。
React Native 图片解码发生在哪个线程,为什么仍可能让 UI 掉帧? 本文先给出可直接复述的结论,再用最小代码说明React Native 图片解码线程 为什么仍掉帧的工作方式、判断依据、项目边界和常见误区。
React Native Image 在 iOS 与 Android 上的缓存行为有什么差异,会带来什么实战问题? 本文先给出可直接复述的结论,再用最小代码说明React Native Image 缓存 iOS Android 差异的工作方式、判断依据、项目边界和常见误区。
React Native Image 组件在列表中使用时有哪些基础性能要求? 本文先给出可直接复述的结论,再用最小代码说明React Native Image 列表 性能 resizeMode的工作方式、判断依据、项目边界和常见误区。
React Native 列表图片加载时的闪烁与布局跳动如何从组件层面避免? 本文先给出可直接复述的结论,再用最小代码说明React Native Image 占位 fadeDuration 布局跳动的工作方式、判断依据、项目边界和常见误区。
React Native 直接渲染几 MB 的原图为什么会造成卡顿和内存飙升? 本文先给出可直接复述的结论,再用最小代码说明React Native 大图 解码 内存的工作方式、判断依据、项目边界和常见误区。
React Native 中本地静态图片与远程图片在打包与渲染性能上有哪些本质区别? 本文先给出可直接复述的结论,再用最小代码说明React Native 本地图片 require 远程图片的工作方式、判断依据、项目边界和常见误区。
React Native Image.prefetch 适合什么场景,滥用会有什么代价? 本文先给出可直接复述的结论,再用最小代码说明React Native Image prefetch 预加载的工作方式、判断依据、项目边界和常见误区。
React Native 的 InteractionManager.runAfterInteractions 解决什么问题,有什么局限? 本文先给出可直接复述的结论,再用最小代码说明InteractionManager runAfterInteractions 场景的工作方式、判断依据、项目边界和常见误区。
React Native 中 JS 线程被长任务阻塞时用户会看到什么现象,为什么? 本文先给出可直接复述的结论,再用最小代码说明React Native JS 线程阻塞 界面卡死的工作方式、判断依据、项目边界和常见误区。
React Native 旧架构中 JS 线程、UI(主)线程与原生模块线程分别负责什么? 本文先给出可直接复述的结论,再用最小代码说明React Native 线程模型 JS 线程 UI 线程的工作方式、判断依据、项目边界和常见误区。
React Native LayoutAnimation 适合哪类动画,什么时候不够用? 本文先给出可直接复述的结论,再用最小代码说明LayoutAnimation 适用场景 局限的工作方式、判断依据、项目边界和常见误区。
React Native 聊天类双向加载列表用 FlatList 需要注意哪些问题? 本文先给出可直接复述的结论,再用最小代码说明FlatList 聊天 倒置列表 inverted 双向分页的工作方式、判断依据、项目边界和常见误区。
React Native 长列表内存持续上涨应如何从列表角度排查? 本文先给出可直接复述的结论,再用最小代码说明FlatList 内存泄漏 排查的工作方式、判断依据、项目边界和常见误区。
React Native 中 FlatList 嵌套在 ScrollView 里为什么既报警告又伤性能? 本文先给出可直接复述的结论,再用最小代码说明FlatList 嵌套 ScrollView VirtualizedList 警告的工作方式、判断依据、项目边界和常见误区。
React Native 新架构(Fabric/JSI)相对旧桥接模型在性能上解决了什么核心问题? 本文先给出可直接复述的结论,再用最小代码说明React Native 新架构 JSI Fabric 性能的工作方式、判断依据、项目边界和常见误区。
React Native FlatList 的 onEndReached 被重复触发或过早触发该怎么处理? 本文先给出可直接复述的结论,再用最小代码说明FlatList onEndReached 重复触发 onEndReachedThreshold的工作方式、判断依据、项目边界和常见误区。
如何用 React Native 内置 Perf Monitor 判断卡顿发生在 JS 线程还是 UI 线程? 本文先给出可直接复述的结论,再用最小代码说明Perf Monitor JS FPS UI FPS 判断的工作方式、判断依据、项目边界和常见误区。
如何用 Hermes 的采样 profiling 定位 React Native 中的 JS 热点函数? 本文先给出可直接复述的结论,再用最小代码说明Hermes profiling 采样 性能定位的工作方式、判断依据、项目边界和常见误区。
React Native 中监听 ScrollView 的 onScroll 为什么必须设置 scrollEventThrottle 并谨慎处理回调? 本文先给出可直接复述的结论,再用最小代码说明scrollEventThrottle onScroll 性能的工作方式、判断依据、项目边界和常见误区。
React Native SectionList 在大量分组数据下有哪些特有性能注意点? 本文先给出可直接复述的结论,再用最小代码说明SectionList 性能 分组列表的工作方式、判断依据、项目边界和常见误区。
React Native 页面转场卡顿的官方排查思路是什么? 本文先给出可直接复述的结论,再用最小代码说明React Native 转场卡顿 slow navigator transitions的工作方式、判断依据、项目边界和常见误区。
Android 上如何用 Systrace 分析 React Native 应用的掉帧来源? 本文先给出可直接复述的结论,再用最小代码说明React Native Android Systrace 掉帧分析的工作方式、判断依据、项目边界和常见误区。
React Native 的 inline requires(内联引用)优化如何缩短启动时间? 本文先给出可直接复述的结论,再用最小代码说明React Native inline requires 启动优化的工作方式、判断依据、项目边界和常见误区。
什么场景下应该直接使用 React Native VirtualizedList 而不是 FlatList? 本文先给出可直接复述的结论,再用最小代码说明VirtualizedList 不可变数据 自定义列表的工作方式、判断依据、项目边界和常见误区。