Ionic 3 slow loading problems with cordova run android livereload?

Ionic Framework ionic-v3
1

Livereload on my devices is by far one of my favorite features of Ionic. I got it working perfectly in version 1, no problem, even though it’s supposed to be experimental. Version 2 has been a different story. It may not work for iOS either but I had other problems with that that I still have to look into.

At first I was having issues that said it couldn’t connect to my IP. I don’t have a firewall and am trying this on a fresh, new blank app so no extra plugins either. I’m able to fire up the app without livereload, no problem. After researching, I tried 2 things I found in other threads on the forums.

I added "run:after": "watch" to my package.json. That did nothing, but I think the scripts have changed since that post in November.

Then I added <preference name="loadUrlTimeoutValue" value="700000" /> to my config.xml. That stopped the error from occurring but the page wouldn’t load. I opened it up with the Remote Device Inspector in Chrome and it was just hanging. I hit refresh and the page did load, but very very slowly. I made a change to the page and the refresh time was no faster. The build time is normal, but the refresh time is painfully slow.

Any suggestions would be greatly appreciated.

2

Verions 1 and 2 of what? Ionic? Ionic CLI?
How does Ionic 3, mentioned in the title, fit in here?

You have 3 different error descriptions in your post:

What changed between these?

3

When I said Ionic 1, 2, and 3, I mean Ionic the framework 1, 2, and 3.
If I had meant the CLI specifically I would have said Ionic CLI.
When I said 2 has been a different story, I should have said 2+ or 3.
Ionic 3 fits in because, to my knowledge, it has a slightly different build and scripts to 2.
Honestly the lines between 2 and 3 are a bit blurry as with 2 and 4 of Angular.
I also said Ionic 3 because my app is using Ionic 3, as opposed to Ionic 1 and Ionic 2.
Once again, I’m talking about the framework and not the CLI.

Granted, it may have been better to put this in a more specific topic, like Cordova.
I chose Ionic in general because I don’t know if the problem is Cordova, Ionic (the framework), the scripts, Webpack or the CLI.

I wasn’t having 3 different errors, I was experiencing 1 error caused by slow loading and then slow loading.
Which is why I said in the title “Ionic 3 problems”.
I mentioned the whole process because it’s good etiquette to mention how you attempted to solve the problem.
I also said Ionic 3 because the question has been answered at least twice for Ionic 2, although never quite resolved.
Once again, I’m referring to Ionic 3 and 2 the framework, not the CLI.

At first I had an error but I bypassed it using instructions I found in this forum as explained.
However it was slow loading afterwards.
What changed between the page not loading and the page loading but slowly was that I hit refresh as mentioned.

I may not have been clear about the command I’m running either. It is:
ionic cordova run android --device -l

And this is my system info:

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.4.0

local packages:

    @ionic/app-scripts              : 1.3.12
    @ionic/cli-plugin-cordova       : 1.4.0
    @ionic/cli-plugin-ionic-angular : 1.3.1
    Cordova Platforms               : android 6.2.3
    Ionic Framework                 : ionic-angular 3.5.0

System:

    Node       : v6.9.4
    OS         : macOS Sierra
    Xcode      : Xcode 8.3.2 Build version 8E2002
    ios-deploy : 1.9.0
    ios-sim    : 5.0.11
    npm        : 3.10.10

Is there anything else that needs clarification?

Or, better yet, have you experienced these slow loading problems? And if so, can you help me solve them?

4

I’m just trying to understand what is the actual issue and what is backstory (which of course is great that you post it!), as probably everyone reading this would have to.

To summarize: You have a Ionic 3 project, you run ionic cordova run android --device -l for it and it builds and installs the app, but then you only get a white screen or a “slow loading page”.

  1. Any other output in the remote console?
  2. Any interesting output on ionic cordova run android --device -l --verbose --debug?
  3. Can you load the URL of the app inside the remote pap manually in your browser? This should be similar to ionic serve, but on a different IP and port.
5

Thank you for this.
Sorry for being snarky. It’s been a rough week.

And now I’m quite embarrassed.
The problem seems to have corrected itself.
I changed nothing since yesterday but it works fine now.

But to answer your questions anyway:

  1. There was no output.
  2. I hadn’t tried that. When I did it today, it worked.
  3. I was able to open my IP in the browser and it worked just fine.

Solution for future Googlers:
Because I changed nothing within Ionic, I believe it must have been something external.
There may have been some issues with the port that my system corrected.
There may have also been an issue with my router or wifi network.
And even though it was slow, livereload did work, so delaying the timeout helped:
<preference name="loadUrlTimeoutValue" value="700000" />

1 Like
6

That are the best problems :wink:

1 Like