You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

React Native安卓端FlatList加载大量数据时内存溢出崩溃问题

安卓FlatList滚动加载Redux数据时内存耗尽崩溃问题

安卓设备上(iOS设备运行正常),无论处于debug还是release模式,滚动FlatList并通过Redux action将API获取的新数据添加到列表时,应用会耗尽内存并崩溃。

FlatList代码

<FlatList
    style={{ width: '100%' }}
    ListFooterComponentStyle={{ marginBottom: 15 }}
    //ListFooterComponent={() => isLoading || (dataSynchronizing && !isSyncingHidden) ? <View style={{ paddingVertical: 2, alignItems: 'center', marginTop: 12 }} ><DotsLoader color={Colors.blue} size={10} /></View> : <View style={{ height: 0, margin: 0, padding: 0 }}></View>}
    ListEmptyComponent={() => (isLoading ? null : <DefaultText style={{ fontSize: 15, width: '100%', textAlign: 'center', color: Colors.lightgray, marginTop: 20 }}>{T.i18n.t('reports.none_found')}</DefaultText>)}
    data={dailyReportsWithPending.filter(report => !report.is_draft || (report.is_draft && report.user_id == userId)).sort((x, y) => { y.id - x.id })}
    keyExtractor={item => item.id.toString()}
    renderItem={renderItem}
    onEndReachedThreshold={0.01}
    onEndReached={() => {
        console.log("next page", reportsPage)
        if (!dataSynchronizing)
            store.dispatch(dailyReportsActions.loadDailyReports(activeProject.id, userEmail, authenticationToken, reportsPage));
    }}
    showsVerticalScrollIndicator={false}
    initialNumToRender={10}
    onRefresh={onRefresh}
    refreshing={refreshing}
    windowSize={8}
    removeClippedSubviews={true}
/>

简化后的列表项渲染函数

为排查问题,已将列表项简化为仅展示ID:

const renderItem = ( itemData ) => (<Text>{itemData.item.id}</Text>);

ID能正常显示,但列表增大过程中原生堆内存持续增长直至崩溃,Android Studio Profiler快照显示内存占用呈持续攀升趋势。

Redux加载数据Action(搭配redux-persist使用)

export const loadDailyReports = (projectId, email, token, page) => {
    return async dispatch => {

        dispatch(authActions.setDataSynchronizing());
        let resources = ['not-empty'];
        const response = await fetch(`${Environment.active}/api/v2/projects/${projectId}/daily_reports?page=${page}`, {
            method: 'GET',
            headers: {
                'Content-Type': 'application/json',
                'X-User-Email': email,
                'X-User-Token': token
            }
        });

        const data = await response.json();

        if (!response.ok) {
            throw new Error(data.errors.toString());
        }

        dispatch(appendDailyReports(data.resources));
        dispatch(authActions.setDataSynchronized());
    }
};

补充说明

已将问题范围缩小到将fetch结果分发至reducer的环节,每次fetch返回的JSON对象体积很大,目前正在排查redux-persist是否为问题诱因。

内容的提问来源于stack exchange,提问作者amorimluc

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.29 17:34:55