I've got an app developed with AngularJS + Cordova/Ionic.
System set up:
AngularJS
Cordova 9
Ionic 1
The issue:
The app is basically an online shop where you have different product groups. You can go inside the group and choose a product there.
After a few page navigations, when I navigate to the previous page, the of the things happens:
A previous in the navigation stack overlays half of the screen of the current page.
Current page duplicates and overlays on the previous page.
When it happens, both of the screens are available and you can scroll for example.
The issue appears on iPhone X and higher only. Android works fine.
What I found in internet didn't give me a clear answer about this issue and how to solve it.
Here are the links for resources:
Ionic app back button causes previous state screens to overlap
https://forum.ionicframework.com/t/ionic-iphone-screen-overlap-on-page-navigation/37900/15
Content overlaps in Ionic 1 app for IOS version 11 and above
Could you help me to find the reason? Thank you
After a long time, the solution was found. In my case, it was a cache issue
when initiating app config you set
$ionicConfigProvider.views.maxCache(XXX);
maxCache(3) was an optimal number for me and now it works without any issues
Related
I'm creating my first web app using React and I've implemented some 3D animations using React-Three-Fiber.
I've already deployed the page in github pages and while in Chrome on the desktop, both in the webpage and in localhost the website works flawlessly (has some freezes but that's not the point).
However, when I visit the page on an Android Phone, all the Canvas stop working and display the text multiple times whenever I scroll (I don't really know how to explain what's happening, so I'll leave this video: https://youtube.com/shorts/O0xXEElAjJs?feature=share . You can see that the problem only exists on the Canvas, since the Header is not a Canvas element).
I've tried to load the page on iPhones but it doesn't even load and just crashes.
On two of the Android phones I've tried, the page loaded nicely at start but after some time it started glitching like in the video.
I have absolutely no clue on what is going on, other than the problem lies on the Canvas that I have created.
I assume this is a simple thing that I might have missed but I'm really lost.
Thanks in advance! :D
Here is the webpage: https://pedrochaps.github.io/
Here is the code: https://github.com/PedroChaps/pedrochaps.github.io
I published an app in the app store, the app was made in react native.
Everything in the app works fine except for a page, when i click to a button to navigate to other page using react navigation i can see the page for 0.5 seconds then i get a blank page.
The app is published in the app store and this happens when i use the real app download from the store, when i use the local app with expo this doesn’t happen and i have no error
enter image description here
This is a screen of the blank page
Apologies if my english is bad hope someone can solve this, happy to answer to questions.
In this case -
the First check is all dynamic value set states are correct.
check the paths of all import libraries and components.
Check library one by one is supported or not
Check UI by commenting one by one.
Check all the functions where the value is setting state properly or not
I was under the impression that for single page applications the reload did not occur. Can one determine from looking at the code and/or behavior whether an app is a SPA? For example the code uses (I think) a router -- does that imply that a reactjs app is a SPA?
In non SPA when you click on a link it load new page which in chrome is shown by spinning circle on tab where title is written. In spa this happens only once when you visit website after that it doesn't show spinnig circle on url change as you navigate website.
Look at reddit website for spa and stack overflow website for non spa.
My website is in AngularJS v1.7.2 (using Laravel PHP framework as backend).
Current issue is the website freezes after resizing several times (2-3 or more times). I have checked Google chrome Task Manager Tool and it showing around 100% of CPU usage at the time of freezes. Same issue also occurred while testing the site in mobile by changing orientation several times. I have already tried solution like bind one way, add track by for ng-repeat, using tools like Batarang but no luck yet. Is there any proper solution for the issue. Please let me know.
UPDATE
The website almost finish. Only the freeze issue currently blocking us. The website mainly containing song, album, playlist, artist.
On home page there is banner (4 images) using iosSlider . then there are per category (8 categories) album (5 album each). on right sidebar there are song list. There are other pages like category page, artist page, album page, song page, user profile pages etc. Also there is a customised player using angular soundmanager2 API. Generally while viewing in desktop normally there no issue so far. But if I check using Device Toolbar (CTRL+Shift+M) and switch to other pages and rotate 2-3 times it just freezes. Even can't reload or refresh the page tab. If I check Chrome Task manager (Shift+Esc) it shows around 100% CPU usages
that time. Thing to notice the issue only occurring if I route to other page(forward or backward or both) then rotate 2-3 times. I am using AngularJS Batarang to sort out the issue but with no clue still now
SOLVED
The issue was with iosSlider. After removing the iosSlider no crash issue now.
I am developing a PWA using react JS
There is a requirement that we need to display the add to Home screen even after the App has been added to the Home screen for the first time
Can any body suggest if this is possible and how?
INFO: Mostly this app will be run on Google Chrome and Safari
Refer to this answer. You simply can't do that, unless you want to do it in specific development/test machines where you can set the below chrome flag,
chrome://flags/#bypass-app-banner-engagement-checks
You can't expect all your end users to set this flag, so this can't be a solution for all the real users.
I also don't see why you would have to show the banner even after adding to home screen, for any other use case. Browsers don't allow this for obvious reasons. It will be annoying the user, if the prompting is left to developers. Linked answer have more clarification on the same.