Would you mind testing my web app?

Hello. I have been working for quite some time (a couple years actually) in a niche web app. It controls PPE (Personal Protective Equipment) as requested by Brazilian regulations and do other things related to my field of work, [b]Safety Engineering[/b]. I managed even to embed fingerprint identification into it! Unfortunately a desktop C# app is needed for that, communicating back to the Xojo web app through http socket. Eventually I intend to change it to a Xojo desktop app with UDP or TCP connecting them. I'll have to learn how to do it though... 
I was proud and happy with the results until more serious real-world situations arises. This new client, a construction company in the south of Brazil with very poor internet connection on their field offices, complained about the lack of speed of the app. It was true. The app took an embarrassing long time to retrieve data from a MySQL database and present it on weblistboxes. The situation repeated itself when I was presenting it to a potential new client in Rio de Janeiro. I was devastated by it.
Once I returned to my office, I looked into the issue and tried every trick I knew in order to speed it up:
  • All webpages are explicitly declared;
  • Eliminated unnecessary webpages, webdialogs and webcontrols (It was especially difficult to get rid of some webcontainers I was “emotionally” attached);
  • Reduced the use of events, especially the mouse and key ones;
  • Replaced the webimageviews loaded with pictures form URL and mousedown events by simple webbuttons and their action events everywhere in the app;
  • Removed the styling features from the weblistbox subclass used in my projects;
  • Introduced “fontawesome” elements to give visual feedback to the user instead of animations and images;
  • Developed a helper app to retrieve data from the database and deliver it to the main app using JSON through some file exchanges in the server (it is used to feed the weblistboxes: I intend to extend its use everywhere in the app if it proves beneficial. I’m also thinking about changing the data exchange between the apps to IPCSocket, although I have not yet “got my hands dirty” with it);
  • Compiled the resulting app with the Aggressive Optimization Level
  • There are 5 copies of the app running behind a “Simple Load Balancer” as shown by @Christian Schmitz, in order to make it run smoother.

The result seems good enough to me. But I would really, really, REALLY, LOVE to hear honest opinions about it:

  • Is it good enough in terms of speed and visuals?
  • How does it compare to other successful Xojo web apps?
  • Are there any areas it can be improved?

There are some options up my sleeves I have not implemented yet:

  • All database interactions are made using MySQLCommunityServer. It can be replaced by MBS SQL Plugin for speed;
  • As my client base is in Brazil, I could use a local server (the server is in the US East Coast as of now) to reduce latency;
  • The server is a very cost effective three core, 4.8 Ghz, 2Gb RAM 40Gb Disk Space, 2000Gb Bandwidth VPS Ubuntu 16.04 LTS Linux Box from Weblink (a Hostinger subsidiary). I Could have it changed to another Linux flavor with a more powerful configuration on another supplier, such as AWS, Azure or any other. (That would have an undesired effect on cost, I guess);
  • The web app is compiled as cgi. It can be compiled as Stand Alone (with some extra effort to get SSL working);

What are the most impacting options from the above?

I have also some other improvements to be made, more of a cosmetic and incremental improvement nature:

  • Put a breadcrumb indicator to show users where they are;
  • Improve the pagination method to work properly with the JSON Helper app;
  • Remove all hardcoded SQL phrases and put them in an accessory file, just as I have already done with other information such as database credentials, using options, icons, fontawesome bits and weblistbox properties (columncount, columnwidth and titles).
  • Use a “pool of database connections attached to the App object”, as opposed to the current practice of having these connections on a per Session basis.

I would also love to hear your opinions about it.

With all that lengthy preamble, I invite you to test my app. As it is in Portuguese with no available foreign language versions, I prepared this little testing script:

1 – Log into the system: https://teste.zepiweb.com.br/cgi-bin/inst_5/index.cgi with these credentials:
Usuário (user): xojotest
Senha (password): xojotest

2 – Check the employee list: Menu Operações/Cadastros/Funcionarios/Listagem
3 – View an employee record: click the “edit” icon on the right

4 – Add a new “Setor” (area) to the database:
Menu Definições/Organização/Setor
Click on the green “Novo” button on the right bottom of the page
Name it as you wish (“Setor” field) and put some comments on the “Descrição” field
Attach this new record to “LBM DATA” As ‘Empresa’, by selecting it from the dropbox and clicking OK. While in the dropbox, test the textchanged and ‘F2’ search features if you wish.
Save the record by clicking on the green “Confirma” button.

5 – Navigate the app anyway you want. If it breaks, please tell me what you were doing.

6 – Logout: Menu “Usuário” (User) (righmost), option “Sair”, confirm on “Sim” (Yes).

If you feel like it, please check the older version with my beloved webcontainers on:

https://teste.zepiweb.com.br/cgi-bin/inst_4/index.cgi
Same credentials apply.

ANY comments are welcome!

This is a one-off request to this group, as it can feel abusive to use you guys to test an app.

If you find some feature you like, I’ll be happy to share.

As a side note, what I have learned in this development journey, is that coding is challenging and fun. Developing an application that people are willing to pay for, is one of the hardest things I have ever done in my life…

Thanks a lot!

I love testing.

Not all labels can be read - for instance in the Setores screen there is a red label Nao something. Only the Nao is visible.

Speed isn’t snappy but okay-ish from Germany.

A 4 level menu isn’t really good usability.

I wanted to sort the Setores to see my new one. But now the columns are awfully broad. Hm… couldn’t see my new Setor. Tried to log in again and got “Usurio / Senha incorretos ou inexistentes”.

Need to do some cooking now.

I am using Opera on Windows 7:

  • I see a “Nao Associados” label on the top right side, and even another one to its right (Irregulares).
  • What I almost can’t see are the two labels of the buttons controlling the column size, they are above the button (the two buttons right above the Novo option).
  • In terms of speed, it feels slow from Spain, but usable.

Is there any reason for not updating the displayed information when a modification has been made? (instead of having to use Actualiza)

Julen

I can only suggest having a look at your app in chrome with the developer console running in network view. You can see that your app is constantly transmitting 227B of data. I don’t use web so I can only assume that its something to do with a timer, but you might want to look into that.

You can also customise chrome download speed using these settings https://www.guidingtech.com/manage-throttle-download-speed-chrome/ which I have set to 100kb/s up and down and 100ms delay. You can then get a feeling for how your app will run on a slow connection and the issues raised.

There are others here that work with xojo web a lot so might be able to shed some light on speeding things up for low bandwidth.

Thanks a lot, guys!

@Beatrix Willius , What browser/machine are you using? I tested the app on windows (in which it was developed and all my users use) and also on an iPad. a 4th level menu was not my first option, but it will do for now. Very interesting your experience trying to sort the weblistbox. Clicking on the header will make the pressed column to increase or decrease its width according to the option selected in the segmentedbar on bottom right of page. I know, it is counter-intuitive. It was a request from an old customer. I’ll probably embed (embedwithin) a little menu on the weblistbox when the user clicks te header. Then the app will present options to increase/decrease width, sort and restore original column widths. Your entries for “Setor” are there! I suggest you try to use the filter “Filtra” button to find it. If you feel like doing some more testing. You have already helped in the past with some “mojibake” issues…

@Julen Ibarretxe Uriguen , The user experience for increasing / decreasing column widths is awkward, as explained to @Beatrix Willius above. It will be changed. Whenever a new entry is made, updating of the weblistbox is ordered when the entry form is closed (I’ll check that it is actually happenning as designed). The “Atualiza” (Update) button was thought as a means to update the screen with entries from other users, since the app is multi-user.

@ , Good point on the timer issue. There are several timers on the app. I’ll make sure they are properly disabled after not needed anymore. I have made some experiences with Chrome throttling. Very useful tool. It helped me realize I was going in the right direction with the app optimization. I’ll look further into it.

Many, Many Thanks!

@Leonidas Brasileiro : I was using latest Safari on Catalina.

Hello @Beatrix Willius , @Julen Ibarretxe Uriguen , @ !

I have made some minor revisions to the web app following your input:

  • Developed new feature to adjust width and sort weblistboxes upon clickng on header;
  • Reviewed all webtimers on the app, to make sure they are behaving properly (not sure if I nailed it)
  • Light review of appearence (could not reproduce the truncated weblabels, though)

I’ll close this thread as “solved”

The web app is complied in “aggressive mode” now. It feels snappier now.

Would you kindly make just one more test? Just check how long it takes to load some pictures on your screen…

1 – Log into the system: https://teste.zepiweb.com.br/cgi-bin/inst_5/index.cgi with these credentials:
Usuário (user): xojotest
Senha (password): xojotest

2 – Check the biometrics list: Menu Operações/Cadastros/Funcionarios/Biometria
3 – View employees “MARCELO TOFFOLI CULAU” and “NAPOLEÃO BONAPARTE”. Can you see their fingerprints and picture? "NAPOLEÃO"s picture is not really him. Its’ me! hahahaha!

Thanks a lot for your support!