My app loads from the editor preview option quickly but takes a long time loading published build

Help & Support
, ,
#1

Hi everyone.

Im trying to build a fairly simple app. Its around 30mb in size and launches pretty quickly when I open with play button inside the editor. However when I try to open my published version on playcanvas or the self hosted version on GitHub it takes forever to load. Sometimes doesn’t load at all. The error messages during loading are pretty much the same in all 3 cases, so I don’t even know where to begin looking for the problem.

Launch the published build hosted on PlayCanvas (yes URL parameters are important to include):

https://playcanv.as/p/jS8ziuc9/?debug=true&filename=https://farsh-mobile.s3.me-south-1.amazonaws.com/cdn/loonie1.png&width=2%274&height=4%273

Launch from the github hosted version:

https://saadjumani.github.io/furnitureDemo/?debug=true&filename=https://farsh-mobile.s3.me-south-1.amazonaws.com/cdn/loonie1.png&width=2%274&height=4%273

Project link:

https://playcanvas.com/project/913048/overview/furnituredemo

#2

Hi @M_Saad_Jumani! The loading time for both links are good (normal/fast) on my device. What kind of error do you get?

#3

Hi, thanks for your response. Whatever issue was preventing or slowing down the apps from loading seems to have been resolved on its own. Maybe it was my bad internet (tho I doubt, I did run a speedtest which came back normal). Maybe GitHub and PlayCanvas faced a short outage? (yes i know it sounds like a bit of a stretch). Anyhow im glad its over. Still, there is some disparity between launching preview from within editor and launching GitHub/Playcanvas published build.

I actually recorded a video where I start by clearing my cache and then loading all 3 links (2 published links and 1 preview from within editor).

video: https://www.youtube.com/watch?v=1Y9JMAsqOr8

Load times are as follows:

PlayCanvas Editor Demo:
Start: 0:47
Ends: 1:23
Total load time: 36 seconds.

Published playcanvas url:
Starts: 1:06
Ends 2:35
Total load time: 89 seconds.

Couldn’t note the end time for GitHub in this instance but its pretty similar to the version hosted on PC.

The demo from inside the editor still loads 2.5 times faster than published app. Not that its as big a deal anymore (since my main concern was 5-10 min load times) but still kind of curious at least how this disparity exists.

#4

These were my times with no caching and limiting Internet connection to 20Mbit/s on a M1 Macbook Air in London

16.63s https://launch.playcanvas.com/1390892?debug=true&filename=https://farsh-mobile.s3.me-south-1.amazonaws.com/cdn/loonie1.png&width=2'4&height=4'3

14.43s https://playcanv.as/p/jS8ziuc9/?debug=true&filename=https://farsh-mobile.s3.me-south-1.amazonaws.com/cdn/loonie1.png&width=2'4&height=4'3

14.16s https://saadjumani.github.io/furnitureDemo/?debug=true&filename=https://farsh-mobile.s3.me-south-1.amazonaws.com/cdn/loonie1.png&width=2'4&height=4'3

These were loaded one by one, closing the previous site first. I noticed in the video you were loading them all at once. Have you tried loading one and timing it, closing it and loading the next one? If a tab is in the background, it may prevent the engine from processing the assets downloaded (ie uploading the textures to VRAM).

As a side note, some of the textures are VERY large in file size.

image
image1432×444 161 KB

Some of them can be JPEGs (AdlerWood_01_A.png) and therefore can be reduced in filesize. Do they also need to be 2048 x 2048? How close is the camera getting to them in the scene? Reducing it to 1024x1024 would reduce the file size to a quarter. You can also use to reduce them even further with minimal quality loss using something like https://tinypng.com/

#5

Here’s how I recorded the times:

I used Chrome Devtools to cap the network speeds and disable catching and refreshed the page. I then used the duration shown in the bottom right as the time taken to load the page.