Really slow first load on a basic splash screen

General
1

H Support.

I have a web app which was super slow to load the home screen so I added a very lightweight splash screen to improve load time. I get 11seconds time to interactive on mobile which is obviously losing potential customers.

mobile:

image
image2044×1526 211 KB

desktop:
image
image2198×1548 219 KB

appID is 8E327DC0-523A-317B-FF34-44261B4F7F00.

Please advise, thanks

2

Hi Steve,

Are you testing a page in the preview mode or the published UI Builder app?

Regards,
Mark

3

hi Mark.

Published

4

Thank you. We will definitely be looking into it. Is the app published into the /web directory?

5

Yes

6

Hi, @steve_bradford.

  1. Are you running the application through the Backendless Viewer or is it already packaged in a native shell and is currently in the appstore\google play\test flight?
  2. Does it load quickly NOT on a mobile device?

Best Regards, Nikita.

7

Hi @steve_bradford

Thank you for sharing the report with us, I’ve created a ticket BKNDLSS-31090 to investigate the performance.

I can see many external requests to some 3rd party libs CSS/JS, but I do not see them on the Settings => Libraries screen, how do you import them?

Regards,
Vlad

8

Hi,its a web app only (and mobile optimised web layout) - no ios or android. its accessed direct through URL

1 Like
9

The web app is essentially your booking app template (backendless) with no external plugins or libraries

10

any updates please?

11

the ticket is in our roadmap and will be investigated/fixed as soon as possible

12

Hi folks. Still taking over 20seconds to load a basic first page. Any ideas?

13

Hello, @steve_bradford.

The ticket is still open. It will be solved as soon as possible.

Best Regards, Nikita.

14

Hi guys, I’m all for Backendless but the time it is taking to resolve this issue is making me look at other options. Please respond and help me resolve this issue.

15

Hi, @steve_bradford!

The ticket has a critical priority. Out ream will look into the issue shortly, I believe we will be able to review it at the next week. Here’s the timeline:

  1. Research
  2. Fix the issue
  3. Deploy to dev environment, test there
  4. Deploy to stage environment, test there
  5. Deploy to production, test there
  6. Report on the support forum that the fix is done

So, as far as the ticket will be fixed (what we can do on our side) and released we will let you know.

Regards,
Marina

16

Hi @steve_bradford

A quick update according to the task:

We have already fixed several google recommendations and it’s in the testing stage, we are going to release it the next week, here is the list of the most important

  • enabled HTTP/2
  • added preload for static js/css files
  • fixed Meta tags (Title/Description)
  • added source mapping for UI-SDK
  • added new options for the Image Component (width/height/alt/loadMode)
  • added new options for the Link Component (aria-label)
  • added new options for the Iframe Component (title)
  • added new options for the Video Component (title)

In progress:

  • splitting the UI-SDK into smaller modules
  • compressing styles.css file
  • adding the Cache-Control response header

We are testing on a page with all our built-in components and now it looks quite promising:

My App 2023-03-31 20-40-09
My App 2023-03-31 20-40-091920×1115 116 KB

Regards,
Vlad

1 Like
17

A quick update:

  • reduced the UI-SDK build by moving DataTable/DateTimePicker/ColorPicker/QRCode into separate js files to accelerate the initial render
  • add minification css/js/json files

once the QA department verified it we can release

My App 2023-04-05 21-44
My App 2023-04-05 21-442754×1590 496 KB

18

Hi @steve_bradford,

All changes that were made on our side have been released. I. You need to republish your application in order to make them work properly. Please get in touch with us as soon as you check it out on your side.

Regards,
Marina