Out of memory error

[Whip]

Which platform(s) does your issue occur on?

• Android
• 7.1.1 Nougat
• Mobile device

Please, provide the following version numbers that your issue occurs with:

• CLI: 4.1.2
• Cross-platform modules: 4.1.1
• Runtime(s): android - 4.1.3
• Plugin(s):

"dependencies": {
    "nativescript-cardview": "3.1.1",
    "nativescript-fresco": "4.0.0",
    "nativescript-loading-indicator": "2.4.0",
    "nativescript-material-icons": "1.0.3",
    "nativescript-plugin-firebase": "6.4.1",
    "nativescript-theme-core": "~1.0.4",
    "nativescript-toast": "1.4.6",
    "nativescript-ui-dataform": "3.6.1",
    "nativescript-ui-listview": "3.5.11",
    "nativescript-ui-sidedrawer": "4.2.1",
    "tns-core-modules": "4.1.1"
  },
  "devDependencies": {
    "babel-traverse": "6.4.5",
    "babel-types": "6.4.5",
    "babylon": "6.4.5",
    "lazy": "1.0.11",
    "nativescript-dev-webpack": "~0.14.0"
  }

Please, tell us how to recreate the issue in as much detail as possible.

Create a page and load a bunch of images in a list view. That's all I've done so far.

Is there any code involved?

In app.js

var fresco = require("nativescript-fresco");
if (application.android) {
  application.on(application.launchEvent, function(args) {
  	console.log("initialized");
        fresco.initialize();
  });
}

In xml

<Page navigatingTo="onNavigatingTo" xmlns="http://schemas.nativescript.org/tns.xsd"
	xmlns:sd="nativescript-ui-sidedrawer"
	xmlns:customControls="shared"
	xmlns:Card="nativescript-cardview"
	xmlns:lv="nativescript-ui-listview"
	xmlns:nativescript-fresco="nativescript-fresco">
        <ScrollView orientation="horizontal" id="silverNew">
		<StackLayout orientation="horizontal" class="new-arrivals">
			<lv:RadListView items="{{ silverItems }}" >
				<lv:RadListView.listViewLayout>
                		        <lv:ListViewLinearLayout scrollDirection="Horizontal"/>
            			</lv:RadListView.listViewLayout>
				<lv:RadListView.itemTemplate>
		                          <Card:CardView class="cardStyle" elevation="15" radius="10" ripple="true" width="120">
						    <grid-layout rows="120, auto">
					                    <nativescript-fresco:FrescoDrawee row="0" width="120" height="120" imageUri="{{ image }}" placeholderImageUri="~/images/loading.jpg" failureImageUri="~/images/loading.jpg" progressiveRenderingEnabled="true" />
					                    <StackLayout row="1" class="card-content">
						                    <label text="{{ name }}" class="bold" />
						                    <Label text="{{ weight }}" />
							    </StackLayout>
						   </grid-layout>
					</Card:CardView>
				</lv:RadListView.itemTemplate>
			</lv:RadListView>
		</StackLayout>
	</ScrollView>
</Page>

For now, I'm returning the same image for every view which is about 85KB in size and there are 20 of them. I get the error

System.err: Caused by: java.lang.OutOfMemoryError: Failed to allocate a 4665612 byte allocation with 4433024 free bytes and 4MB until OOM
System.err: 	at dalvik.system.VMRuntime.newNonMovableArray(Native Method)

[VladimirAmiorkov]

Hi @VeeK727 ,

Can you share with me the specs of the device/emulator you have in your test, I mean the actually model, memory, CPU, RAM etc.

On a side note, could you try to remove the CardView from the template and see if the same issue occurs. I have found that the card view is quite heavy and to me it looks to be the cause of some strange behavior once it is used inside a list view component's template.

[Whip]

Hi. THe phone I'm using is Yu Yureka Black.
Model YU5040
CPU - Octacore cortex-A53, 1.4Ghz
Ram - 4GB
Memory - 32GB
Android - 7.1.1

I have about 1.5GB RAM free at all times. BUt looking at the error, it seems android has only allotted 4-5MB to the app. Is that normal?

I'll be doing more tests and I'll get back to you.

[VladimirAmiorkov]

Thank you for the information. Keep me posted if you find anything else that could be related.

[zbranzov]

Hi @VeeK727 ,
I was unable to reproduce your error on LG6 Android 7.0 using the provided code. Do you reproduce the error if you remove Fresco plugin because I can't see anything related to it. If you are able to provide complete project we might be able to investigate further.

[Whip]

Yes I do get the error without fresco, that's why installed this, but it seems its not making a difference. Is it possible to monitor memory heaps? And how many images are you loading in your list with what size?

[zbranzov]

@VeeK727 You can take a look at the demo in this repository. It has a similar example that loads many images without any error.

[Whip]

It seems the out of memory occurs when I'm going back and forth on the pages. Maybe there's a memory leak somewhere. Is there a way to monitor memory heaps so I could get an idea how memory consumption changes?

[VladimirAmiorkov]

Hi @VeeK727 ,

Maybe this issue may be the source ProgressNS/nativescript-ui-feedback#748 . We are aware of it and are already working on a fix for it, we hope to publish a new version as soon as possible that should resolve it but it will involve a new version of both nativescript-ui-listview + a new version of tns-core-modules-widgets (you can follow this PR)

[Whip]

Thanks for the update. It does seem like the similar issue. I'll be waiting for the fix.

[VladimirAmiorkov]

Closing this issue.

The issue in nativescript-ui-listview has been fixed and released with its 3.6.0version and the issue in tns-core-widgets can be followed here, once it is released this memory issue should not be present.