High memory usage in Ionic app - android

recently I have observed thath my android app uses too much of RAM.
When i open it it takes ~~120mb and after few changes of pages it goes to 400mb.
What can I do?
To change page I use popover with:
this.navCtrl.setRoot(StatisticsPage);
Some data from profiler:
link to data

Whenever you need to go into the child component then instead of using this.navCtrl.setRoot(StatisticsPage); you can use this.navCtrl.push(StatisticsPage);
this could be one point of improvement.

Related

How to open page with result like contactbook?

In my UWP-App I want to create an app internal contactbook page. I can select a contact and return the selected contact back to the page where I opened the contactbook.
In Android where I come from there is a function called "startActivityForResult" which opens an activity gets the return value when finished.
I want to create the same behaviour.
I did this with Frame.Navigate(typeof(ContactBook)) and then when the contact is selected I navigate back with Frame.Navigate(typeof(PreviousPage), selectedContact)
The method Frame.GoBack() is useless in this case because I can't pass a parameter.
How can I solve this problem?
I'm not 100% familiar with android and "startActivityForResult" but are you looking to navigate the entire frame away? There isn't any equivalent in UWP apps, nor is there even really one for WPF's showDialog(), which is probably what you're looking for.
You only have a few options and none of them are really "amazing" per-say.
You can do what you've done above, which is navigate away to the page that has all the contacts, then navigate to a new page but depending on how your app is layed out you might be losing data on the page (since it's a new instance and not a back in the stack so you can't really cache it). You also can't navigate to an instance of a page either, it's only to a new page or through the stack from back / forward. If you use GoBack though and cache the page (using the "required" mode for caching) then you could do some dirty lookup of a stored value in a static class (I know, ugly and not MVVM) or setting a local settings value and reading that in the OnNavigatedTo() method for the page before.
If you don't NEED to use frame movement, you can use a flyout or a custom flyout user control to build a popup of sorts that will display the XAML for the page instead of a page frame. This will have a few difficulties with resizing (so more so for W10 than W10M) and such but you'll be able to not transition out of the frame itself. Then you can see the value of the selected and then on the submit event, you can just work with the page since it's already open.
If need be you could build a custom usercontrol for the flyout and put some custom dependency properties that can be bound for MVVM, it really all depends on what and how you're doing it.
So short answer, there is no fast way of achieveing what you're looking for and that does seem like an issue with the API. I would make the suggestion on the API's uservoice (https://wpdev.uservoice.com/forums/110705-universal-windows-platform) and try to get it upvoted!
There isn't any equivalent in UWP apps, nor is there even really one for WPF's showDialog(), which is probably what you're looking for.
#Daniel, no, there is a equivalent in UWP apps. Please refer to Launch an app for results, you can follow the tutorial in that doc to achieve this.
To do this, you will need to create two apps. One is the app which will launch the result app (let say "main app"), the other app here should be the contact-book app. The contact-book app will behavior like a modal window, and the main app will wait for the result of the contact-book app.
But in an UWP app, you can use ContactStore class to access the database that contains contacts.
So, you will need to reconsider if that is necessary to create a contact app by yourself.
Edit:
I may misunderstand your question, you just want your page to behavior like contact-book, not want to create a contact-book by yourself. But anyway, it's the same, you can create another app to hold your page which you want to launch from your main app.

Ionic: slow transitions in installed android app

I have installed an Ionic app (beta 14) on my Android (Lollipop) device using:
ionic platform add android
ionic run android
I have also manually built the app and installed it with adb.
The app uses ion-side-menus, and the animations for the transitions between simple views (list -> detail -> detail) are incredibly laggy on a capable phone. The animation when the side menu slides out is very smooth in contrast.
To further investigate the situation, I served the www directory from my dev machine and opened that page in Chrome on the phone and it was as smooth as one would expect. The app also runs smoothly on iOS devices.
Does anyone have any clues as to why it is so slow when the app is in Ionic, but performs as expected when it is just being rendered in the browser?
I faced with the same issue. It's worse in cases that you need to load a lot of information. In those occasion, I disable the transition effect by setting:
nav-transition=none
if you need to disable the transition from your controller, do the following:
app.controller('ctrl', function($scope,$state, $ionicViewSwitcher){ $scope.goBack = function(){
$ionicViewSwitcher.nextTransition('none');
$state.go('back');
});
I found some solutions by which I face problem in ionic app transitiosn..
After State Change I use this code..
//OnState Change..
$scope.$on('$stateChangeSuccess', function() {
$ionicLoading.show();
MyTeamListing();
})
which hit serve every time when i change state.. which is slow down the app.
i just Remove first line and my code is working fine...
I don't know it is a good or bad way but its working for me fine..
Transaction is become slow if too much data is load on transaction
so that I use ionic events which load data after transaction done.
$scope.$on('$ionicView.afterEnter', function(){
console.log("afterEnter");
$ionicLoading.show();
loadRemoteData();
$ionicLoading.hide();
});
Well, the perks of developing hybrid application is its code re-usability and faster development however, what advantage we get on development results in slow hybrid apps. We can make the application relatively faster if we follow following points:
absolutely remove the comments and unnecessary functions
minimize the white-space, make your functions as small as possible
use minified css and js
optimize the images, the fewer the images the faster the application
if possible, preload the images check here
keep the nonessential js file to the bottom of the page just before the end of body tag
remove the unnecessary pages, unnecessary scrolling and large pages.
limit the usage of input boxes; make use of radio buttons,checkboxes and comboboxes if possible.
don't use jquery library unless of utmost necessity, use javascript

Is local storage for a Phonegap app on an Android device separate from the built in browser?

My question is essentially a follow up or clarification to this question.
I have an Android app built using Javascript and Adobe's Phonegap Build service, and I'm using "local storage" to store data on the device.
From that other question, I learned that data stored in local storage is essentially "permanent", in that it will stay on the device indefinitely, unless the user acts on it by manually clearing the cache for the app or deletes the app (and maybe other unusual circumstances that I'm willing to live with).
However, part of the accepted answer was confusing to me in that it started to blur the lines between talking about the phone's browser and talking about a Phonegap app.
What is unclear to me is if an app on Android using Phonegap uses the same cache as the phone's built in browser. Is Phonegap essentially an extension of the existing browser facility, or is it it's own separate stand-alone and self contained browser?
Critically, if a user clears the cache in their browser, will that impact an installed app based on Phonegap?
Since Phonegap uses Webiview to render your app : WebView and Phonegap.
And For security reason each app that uses WebView has its own cache and history.
"No User or OS wants such data to be accessed by 3rd party applications".
So in a nutshell, your app will keep its own history and data in its cache folder and will be deleted in one of the following cases:
User manually deleted them.
User used app setting screen and deleted them.
App uninstalled.
To read more about this. take look at WebView cache : Cookie and window management
Nope, the cache created within the in-app browser can only be deleted with the methods:
window.localStorage.removeItem("key");
or
window.localStorage.clear();
or app uninstall
or manual action (delete data/cache) in the application manager.
But the best answer is to make an experiment yourself and see what happens.
Yes it is separate but there are time where you need to pass a variable of some kind to the In App Browser. It makes coding so much more easier to pass a ls item from a current webview to another one like in iOS.
Here is what I did in PhoneGap
I use the InAppBrowser executeScript() to pass a copy of the current webviews localStorage to another.
//add the listener to detect when the page loads after inappbrowser is called into view
ref.addEventListener('loadstop', function(){
ref.executeScript({code: 'SetInAppBrowserLocalStorage(\''+localStorage+'\');'});
});
//In your inAppBrowser page you create a function that will get called on loadStop
//This will pass "all" the contents of the main webviws localStorage to the webview
//created by InAppBrowser
function SetInAppBrowserLocalStorage(localStorageThatWasPassed){
localStorage = localStorageThatWasPassed;
};
You could also clear the localStorage created by SetInAppBrowserLocalStorage() before the use leaves that view as well.
Tested and working 100% :)...let me know if you need more help
***UPDATE*****
This still works ...but not consistently anymore. After much testing I realize this is simply not the way to go. Sometimes the data simply is not passed fast enough when the inappbrowser instance is created. I talked to the cordova guys via there issue tracker and they told me it wasn't a secure way of doing things...I get that...but my response to them was what if I just want to pass ls variables between pages in my app..those are not even accessible from the internet... I honestly don't understand why the ls items can't be accessible globally in the app like it is in iOS and the rest of the web. If anyone has a better solution I would love to hear about it.
By making this setting in your mainActivity (which is extending Droidgap.)
super.appView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
We are making our app to not to store cache.

Sencha app is too slow on IOS and Android

i have written a somewhat small application , yet it runs very slowly on IOS and Android devices , it seems to me that the device takes much time to render the GUI.
i made sure to require every component needed on launch time, my application consists of 5 tab panels , each one contains a navigation view with multiple panels , i have set the autoDestroy property of navigation views to true.
i used sencha 2.0.0.0 and 2.0.1.1 and phone gap cordova 1.7.0 , cordova 1.8.0
Any suggestions?
i made sure to require every component needed on launch time
Because this, your application launches slow. The main reason is all of your elements are added to DOM tree right at startup time (you can inspect your application's DOM tree by Chrome's debugger tool to see it).
The best practice to optimize responsiveness of your application is discussed somewhere, here's one of them:
PhoneGap 1.4 wrapping Sencha Touch 2.X - What about performance?
For your situation, a better way to implement is:
Divide your application into 2 main views, an Ext.TabBar and an Ext.Container
Listen to changes in TabBar clicks, if user changes from a tab to another, remove your view in the main container and add appropriate views. It ensures your application only contains exactly 2 views at any time.
Hope it helps.

Demoing android app screenshots

I need a way to show off concept designs of an android application on an android phone to simulate that it is running. Basically just being able to tap to advance to the next photo/screen would be sufficient with a tap ANYWHERE on the screen. Any tools you know that would be helpful?
Eclipse with Android toolkit.
Write a small program. wont take up much time.
[update]
No coding is required. Create an android project Using Eclipse android project, you can visually create UI prototype (i.e. drag and drop .. no coding). Use main.xml after developing each screen run the project in emulator, you can take screenshot of the same (either using eclipse DDMS plugin's snapshot capability or using Alt+Print screen in windows or something similar in other OS). Use this screenshot in a powerpoint presetation . Repeat the same process for a second screen (overwrite the same main.xml so that you dont have to write code). take screenshot again. Add the required animations in powerpoint.
Is there any other option that does not involve any code?
The easiest way I can think of is:
1. Take screen shots(wireframes, screen prototypes) for every screen flow you wish to demonstrate.
2. add them in proper sequence(regulated by sequence number) to your sdcard.
3. Open Picture gallery and use swipe gesture to transition and cycle between screen, walk through all the screen flows.
Do it photoshop, create images, add it to an activity. Create a layout that fills the parent, add it as a background. Then implement a ontouch method to finish the activity and load the next. Quite simple.

Categories

Resources