2

I'm currently serving a website using Express on a Raspberry Pi 4B, hooked directly into a wireless gateway via ethernet.

Unfortunately, while the website works fine most of the time, every few requests it takes twenty seconds to load whatever page you're requesting. I find this really weird, as according to the server logs, it's only taking an average of two seconds to load. Here's an example request, as recorded in the server logs:

GET /attendance 304 298.553 ms - -
GET /stylesheets/style.css 304 1.188 ms - -
GET /stylesheets/coming.css 304 1.086 ms - -
GET /javascript/jquery-3.6.1.min.js 304 1.032 ms - -
GET /javascript/dropdown.js 304 1.896 ms - -
GET /images/OA%20NSS%20Logo.png 304 1.051 ms - -
GET /images/beach.jpg 304 1.036 ms - -
GET /images/menu_hamburger.svg 304 1.040 ms - -

If I'm reading that right, the requests should have only taken a total of slightly over 1.6 seconds. However, according to my web browser's request logging that same request took a lot longer (19.79 seconds), with the main culprit being the main document (19.27 seconds). All the other stuff (pictures, stylesheets, etc.) loads in a timely manner. Here's a screenshot of the browser's logs: https://i.stack.imgur.com/iJpWJ.jpg

According to the browser, 19.11 seconds of the 19.27 seconds the main document takes to load are spent "Blocked". I'm not quite sure what this means, but it's probably significant.

Is what's slowing these requests down a problem with my code, a misconfigured network, or something else entirely?

In Hoc Signo
  • 123
  • 4
  • All those requests including the one that took 20 second come from cache, not from your server. Are you requiring every request to be re-validated? Have you investigated with a fresh browser? Load testing tools? A command line downloader? – Stephen Ostermiller Jan 24 '23 at 18:44
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Jan 24 '23 at 18:47
  • @StephenOstermiller I'm afraid the only term I understood was the bit about testing with a fresh browser. I'm new at this. – In Hoc Signo Jan 24 '23 at 18:56
  • @StephenOstermiller I tried testing it with a browser with the cache cleared; the problem persists. Chrome dev tools says that the vast majority of the loading time is spent "stalled". – In Hoc Signo Jan 24 '23 at 18:57

1 Answers1

3

I'm not able to duplicate the issue. It loads fast considering it is "using Express on a Raspberry Pi 4B, hooked directly into a wireless gateway via ethernet."

You should be aware that the uplink speed of service provided to a home or business is a lot less than the downlink speed for data services. If you are serving through a wireless connection this is a bottleneck... somebody sending email on the wifi would be using bandwidth.

What I'm seeing is just over 1 second for a 1.4 Megabyte page on a ctrl+refresh, (status code 200, IE a fresh user) and just under a second on a refresh, (status code 304, IE a returning user).

Should note, you are clipping off most of the beach.jpeg on the top and bottom in the CSS. You could reduce the size of the image by uploading a cropped image and may be able to take 1/2 second off the typical load time. But 1 second is not excessive in today's internet.

enter image description here

enter image description here

As the size of data is not excessive, the arrangement of resources agrees with best practices.

Blocking refers to when nothing can be displayed on the browser because it needs to download a resource to know how to render the page.

In your case blocking points are:

  1. you need to download the HTML (which is where the issue was noted)

  2. you need to download the two CSS files in the head of the HTML.

  3. you need to download the two javascript files.

As the CSS and javascript are small files best practice is to put them in the head of the document, (which is where they are), but you will come across recommendations to put javascript at the end.

CSS is almost always in the head of the document, but it does work non-standard when it is placed at the end. This use case is for extremely large sites that take 19 seconds to download from a high-speed connection of the backbone of the internet. Your site is not a use case.

I would suggest the bottle-neck is between the internet service you are being provided and the Raspberry Pi, which might be at the wireless point. This is why Hosting service providers are worth the cost, and for some small sites, free hosting is possible.

Rohit Gupta
  • 2,468
  • 2
  • 9
  • 25
Wayne Smith
  • 2,636
  • 12
  • 15
  • the first waterfall (URL) is the connection to php, database, web-service like apache, ngnix i thinks its a server problem, not a website problem. the website output comming after the URL request. and yes, the image, js, css to large. go to a compressor. – Sebastian Jan 25 '23 at 15:30