Running web page from Raspberry Pi or alternative SBC or combination

[jasonlodder]

Has anyone gotten a web browser to respond swiftly on a Raspberry Pi Zero W / Raspberry Pi Zero 2 W? I'm attempting to run local leaflet maps on my PI's. They can currently host it, but I can't get it to display on a web browser with a fast enough refresh rate to be functional. The goal is to host and display a leaflet map on a Raspberry Pi outside in the field with a TFT screen attached.

I have some additional boards to test and combine if the above is not possible, which could perhaps be used as a driver board combined with the PI's?

• Raspberry Pi 4 Model B (Not ideal as it is bulky and I am trying to keep cost / power consumption down)
• Raspberry Pi Pico
• ESP32
• ESP8266
• D1 Mini
• Arduino UNO
• Arduino Mega
• Arduino Nano
• Arduino Due

Thank you

 

[ronsimpson]

Are you connected wire-less or wired?

 

[rjenkinsgb]

The Pi itself should not have any speed problems, the built-in GPU is pretty good and has no problem displaying web pages on a full HD monitor.

The display response will be excruciatingly slow if it is using SPI (or worse I2C) to drive a relatively large screen, though.

For fast screen updates it needs a display that is driven from the Pi onboard GPU; either through HDMI or the DSI ribbon connection.

Something like this should work OK on a Pi 3 or Pi 4 etc. that has the DSI port:

5" DSI Capacitive Touch Display for Raspberry Pi (800×480)

Apart from the Official Raspberry Pi Touchscreen Display, we don't often see many DSI interface displays for the Raspberry Pi. This capacitive touch display is one of those rare treasures, using the simple DSI ribbon cable connection to the Raspberry Pi - avoiding bulky HDMI solutions for an...

thepihut.com

Look at the Pi 3A Plus if you want something a bit cheaper & more compact (lower profile) than the normal Pi 3 / Pi 4. You can find them on ebay occasionally, I've just got a couple of them.

Raspberry Pi 3 Model A+ 512MB Quad Core WiFi & Bluetooth

Raspberry Pi - SC0130(j) - Raspberry Pi 3 Model A+ 512MB Quad Core WiFi & Bluetooth - <p>Introducing the latest flavour of Raspberry Pi - the <b>Raspberry Pi 3

www.rapidonline.com

For info, that 800 x 480 display, which is not particularly high resolution, needs 768K Bytes transferred per video frame, if only using 16 bit colour.

Even if you can push SPI to 16Mbit, that would take 384 mS for each full screen redraw, not counting any overhead or control data etc. when using an SPI display of that resolution.

Roughly 2.5 frames per second.

Any serious resolution display screen that needs to update smoothly overall from graphics scrolling or for video etc. can only work via one of the dedicated display interfaces from the GPU.

No board without a GPU is likely to be suitable.


A Pi Zero could work with a screen that has HDMI in; eg. possibly something like this one that comes with an HDMI interface board:

4.3" 800x480 Raspberry Pi Touch Screen TFT LCD Display w/HDMI Board

ER-TFTV043A1-7 is 4.3"raspberry pi screen display in 800x480 resolution with small hdmi driver board,optional touch panel,touch driver,remote control,power.

www.buydisplay.com

 

[jasonlodder]

Are you connected wire-less or wired?

Are you referring to my internet connection?
I'm currently testing it over wifi. I have the option of connecting via wifi on my phone or a wifi hotspot with a sim card device. I've also been looking into and experimenting with running a local offline map that could speed things up and allow me to go out in the field without relying on internet service or a strong signal. The real issue is displaying it on a screen powered by the Pi and directly connected to the Pi.
The screen I am currently working with is this one and I connected it according to their wiki page like this

 

[jasonlodder]

The Pi itself should not have any speed problems, the built-in GPU is pretty good and has no problem displaying web pages on a full HD monitor.

The display response will be excruciatingly slow if it is using SPI (or worse I2C) to drive a relatively large screen, though.

For fast screen updates it needs a display that is driven from the Pi onboard GPU; either through HDMI or the DSI ribbon connection.

Something like this should work OK on a Pi 3 or Pi 4 etc. that has the DSI port:

5" DSI Capacitive Touch Display for Raspberry Pi (800×480)

Apart from the Official Raspberry Pi Touchscreen Display, we don't often see many DSI interface displays for the Raspberry Pi. This capacitive touch display is one of those rare treasures, using the simple DSI ribbon cable connection to the Raspberry Pi - avoiding bulky HDMI solutions for an...

thepihut.com

Look at the Pi 3A Plus if you want something a bit cheaper & more compact (lower profile) than the normal Pi 3 / Pi 4. You can find them on ebay occasionally, I've just got a couple of them.

Raspberry Pi 3 Model A+ 512MB Quad Core WiFi & Bluetooth

Raspberry Pi - SC0130(j) - Raspberry Pi 3 Model A+ 512MB Quad Core WiFi & Bluetooth - <p>Introducing the latest flavour of Raspberry Pi - the <b>Raspberry Pi 3

www.rapidonline.com

For info, that 800 x 480 display, which is not particularly high resolution, needs 768K Bytes transferred per video frame, if only using 16 bit colour.

Even if you can push SPI to 16Mbit, that would take 384 mS for each full screen redraw, not counting any overhead or control data etc. when using an SPI display of that resolution.

Roughly 2.5 frames per second.

Any serious resolution display screen that needs to update smoothly overall from graphics scrolling or for video etc. can only work via one of the dedicated display interfaces from the GPU.

No board without a GPU is likely to be suitable.


A Pi Zero could work with a screen that has HDMI in; eg. possibly something like this one that comes with an HDMI interface board:

4.3" 800x480 Raspberry Pi Touch Screen TFT LCD Display w/HDMI Board

ER-TFTV043A1-7 is 4.3"raspberry pi screen display in 800x480 resolution with small hdmi driver board,optional touch panel,touch driver,remote control,power.

www.buydisplay.com

This is the screen I'm currently using from piHut. Based on their wiki, I connected it like this. Because the screen is 240x240, it should be easier to process because it has a lower resolution to display. The frame rate does not need to be extremely fast; even one frame per second will be fine. Just as long as the map can redraw the updated location on the screen as I walk to show the current location.
Can I get an adapter or converter to connect my screen to the HDMI port on my Pi Zero 2 W, as opposed to the last link you posted?

 

[ronsimpson]

I have a Pi3 connected to a large HDMI monitor, and we play video games on it. The graphics is fast. I do not use little LCD displays because the interface is slow. I think you cannot do action videos on that little display.

 

[rjenkinsgb]

This is the screen I'm currently using from piHut. Based on their wiki, I connected it like this. Because the screen is 240x240, it should be easier to process because it has a lower resolution to display. The frame rate does not need to be extremely fast; even one frame per second will be fine. Just as long as the map can redraw the updated location on the screen as I walk to show the current location.
Can I get an adapter or converter to connect my screen to the HDMI port on my Pi Zero 2 W, as opposed to the last link you posted?

The screen itself is SPI, which means it is very slow for graphics.

The display graphics need to be recreated in software rather than using the OS drivers and GPU; it also appears that's done in Python, which will slow it down further.

There is no practical way that I am aware of to use such an SPI screen with any form of HDMI adapter; they are designed to drive screens with fast interfaces that can update at video rates.

However, there are small circular displays with parallel interfaces that do work with an appropriate HDMI interface board:

480x480 Round IPS TFT LCD Display 2.1 inch Capacitive Touch Circle Screen

ER-TFT021-1 is 2.1" IPS tft lcd display,4800x480 pixel,micro round screen panel for smart watch replacement,w/capacitive touch panel,optional HDMI Driver Board.

www.buydisplay.com

Note that you need to select the HDMI driver board option as well as the display, so around $44 for the set.


ps. Note that you can buy connectors such as these on ebay, to avoid using a full size HDMI cable in a small device:

DIY HDMI Cable: Right-angle HDMI Plug Adapter, DIY HDMI Ribbon Cable 5055652907844 | eBay

Find many great new & used options and get the best deals for DIY HDMI Cable: Right-angle HDMI Plug Adapter, DIY HDMI Ribbon Cable at the best online prices at eBay! Free delivery for many products.

www.ebay.co.uk

HDMI Male Adapter Type A HDMI Cable Adapter FPC Ribbon For DIY | eBay

Find many great new & used options and get the best deals for HDMI Male Adapter Type A HDMI Cable Adapter FPC Ribbon For DIY at the best online prices at eBay! Free delivery for many products.

www.ebay.co.uk

They link using flexible flat ribbon.

 

[ronsimpson]

The frame rate does not need to be extremely fast; even one frame per second will be fine.

If a 1 frame/second is OK and things are too slow then there is a slow spot somewhere in your program/hardware.

Do you have an oscilloscope?
The display can go up to 16mhz. I do not think Python can clock that fast. You will need to clock=0, output data, clock=1, get the next data ready. Data can be 12, 16, or 18 bits. (3 outputs x 16 x240 x240 = 2,764,800) You could look at the clock line and see how fast. You can update the display, then measure the time with a scope or you can do it in software. There is a chance you are burning 50% of the time in updating. If you move the LCD driver to C or machine code you will need to watch that you stay under 16mhz.

You could write a "1" to the LCD, update the entire LCD, increment the "1" and loop. See how fast the display runs. If python can only write to ports at 3 million times a second, then you are limited to 1 frame/second with no other tasks running.

Found this data for the Pi 1 and Pi 2. We know Pi 3 & 4 are faster. This table gives me the idea that even on a Pi 4 you will never get close to 1mhz using Python.

 

[jasonlodder]

The screen itself is SPI, which means it is very slow for graphics.

The display graphics need to be recreated in software rather than using the OS drivers and GPU; it also appears that's done in Python, which will slow it down further.

There is no practical way that I am aware of to use such an SPI screen with any form of HDMI adapter; they are designed to drive screens with fast interfaces that can update at video rates.

However, there are small circular displays with parallel interfaces that do work with an appropriate HDMI interface board:

480x480 Round IPS TFT LCD Display 2.1 inch Capacitive Touch Circle Screen

ER-TFT021-1 is 2.1" IPS tft lcd display,4800x480 pixel,micro round screen panel for smart watch replacement,w/capacitive touch panel,optional HDMI Driver Board.

www.buydisplay.com

Note that you need to select the HDMI driver board option as well as the display, so around $44 for the set.


ps. Note that you can buy connectors such as these on ebay, to avoid using a full size HDMI cable in a small device:

DIY HDMI Cable: Right-angle HDMI Plug Adapter, DIY HDMI Ribbon Cable 5055652907844 | eBay

Find many great new & used options and get the best deals for DIY HDMI Cable: Right-angle HDMI Plug Adapter, DIY HDMI Ribbon Cable at the best online prices at eBay! Free delivery for many products.

www.ebay.co.uk

HDMI Male Adapter Type A HDMI Cable Adapter FPC Ribbon For DIY | eBay

Find many great new & used options and get the best deals for HDMI Male Adapter Type A HDMI Cable Adapter FPC Ribbon For DIY at the best online prices at eBay! Free delivery for many products.

www.ebay.co.uk

They link using flexible flat ribbon.

rjenkinsgb Thank you for your detailed response. I would like to learn more about this topic in order to better myself and educate myself, but I also hope to be able to share my knowledge with others in the near future, as you are doing here. One of the project's primary goals was to try to get it to function on these low-cost displays. The plan was to make it open source and allow others to learn, as I am, how to interface these low-cost devices to make them work in the real world and in the field.

I'm beginning to understand that these screens have limitations, but I'd like to see how far we can push them. It is not necessary for the screen to have a high resolution or even a fast refresh rate. It should be good as long as it can update every 1-2 seconds. I'm more inclined to make things function at this stage. Obviously, if I need more screens, I can acquire them, but the goal is to make it inexpensive and accessible for anyone to replicate.

Looking at the screen you linked to above, it appears to be comparable to the one I have. Mine has a ribbon as well, but it is attached to a driver board with an SPI output. Is this where I could find a solution if I get my hands on a bare screen without this driver board and attach it to a different driver board?

Is the driver between the screen and the Pi the bottleneck? If that's the case, could I utilise another microcontroller, such as the Pico, to act as a bridge? It can drive the displays (though not at high resolutions, as I am finding out), but if the Pi could send the data more efficiently and allow the driver microcontroller to handle some of the load, I might be able to do a bit better. What are your thoughts on this?

The leaflet maps that I'm looking to incorporate into my project utilise Python or JavaScript, so I figured that using OOP would make it easy to push those objects and display them on the screen. Perhaps as a second overlay layer.

I'm looking forward to your response and views on this.
Kind regards

 

[jasonlodder]

If a 1 frame/second is OK and things are too slow then there is a slow spot somewhere in your program/hardware.

Do you have an oscilloscope?
The display can go up to 16mhz. I do not think Python can clock that fast. You will need to clock=0, output data, clock=1, get the next data ready. Data can be 12, 16, or 18 bits. (3 outputs x 16 x240 x240 = 2,764,800) You could look at the clock line and see how fast. You can update the display, then measure the time with a scope or you can do it in software. There is a chance you are burning 50% of the time in updating. If you move the LCD driver to C or machine code you will need to watch that you stay under 16mhz.

You could write a "1" to the LCD, update the entire LCD, increment the "1" and loop. See how fast the display runs. If python can only write to ports at 3 million times a second, then you are limited to 1 frame/second with no other tasks running.

Found this data for the Pi 1 and Pi 2. We know Pi 3 & 4 are faster. This table gives me the idea that even on a Pi 4 you will never get close to 1mhz using Python.
View attachment 138409

Hi ronsimpson,
To be honest, I am still quite limited in my knowledge of many elements of this, and there are other people with far more expertise and experience on these forums who would most likely be able to answer your questions better. But I will do my best to answer. Unfortunately, I do not own an oscilloscope, but perhaps someone on this site who does could provide you with those results? I saw a site that ran some performance testing on the various Pi's here, and it appears that the Pi Zero 2 W is more equivalent in terms of performance to the Pi 3b+, and in some instances even more efficient.
According to the table you referred to above, if a different programming language is required to create the software, it is also acceptable. I've been learning and am eager to learn other languages if they are required for the project. Because the Pi Zero 2 W has a quad-core CPU, potentially some data, such as sensor readings input, might be multi-threaded? According to your table, the C language appears to be the more efficient language. The screen also has some C language examples, but they are fairly basic. I'm not sure if this helps, but here's a link to the screen specs and a link to the wiki if that's of any assistance.

Looking forward to see your response and thoughts.
Kind regards

 

[Nigel Goodwin]

According to your table, the C language appears to be the more efficient language.

The problem is that Python is an interpreted language, so it's VERY, VERY slow compared to a compiler like C - really any decently designed and written compiler should be a fairly similar speed to C, dependent really on how good the optimisation is.

A compiler produces machine code, which the machine then runs, so it's effectively written in (relatively poor) machine code.

For those who remember the old Commodore Amiga (one of the best computers ever), it's OS (which was similar to UNIX) was written using C - and a number of enthusiasts got together and rewrote much of the OS routines in native machine code instead, this reduced the size of the OS routines to something like a quarter of the C compiled versions, and they ran 4 or 5 times faster.

 

[rjenkinsgb]

Looking at the screen you linked to above, it appears to be comparable to the one I have. Mine has a ribbon as well, but it is attached to a driver board with an SPI output. Is this where I could find a solution if I get my hands on a bare screen without this driver board and attach it to a different driver board?

Is the driver between the screen and the Pi the bottleneck? If that's the case, could I utilise another microcontroller, such as the Pico, to act as a bridge? It can drive the displays (though not at high resolutions, as I am finding out), but if the Pi could send the data more efficiently and allow the driver microcontroller to handle some of the load, I might be able to do a bit better. What are your thoughts on this?

It's down to the hardware (panel driver IC or ICs) used within the display panel itself. If it only supports SPI, then nothing can speed it up.

If it supports DSI, DPI or HDMI, then a direct video connection from the Pi is possible, and all the graphics creation can be done directly in the GPU rather than in the system RAM and separately copied out to the display.

 

[Pommie]

Could this use a smart watch? Use the ESP32 to host a server and be an access point, connect to it with a smart watch and display whatever is on the server. The watch could also supply position information. Or, is this barking up the wrong tree?

Mike.

 

[jasonlodder]

It's down to the hardware (panel driver IC or ICs) used within the display panel itself. If it only supports SPI, then nothing can speed it up.

If it supports DSI, DPI or HDMI, then a direct video connection from the Pi is possible, and all the graphics creation can be done directly in the GPU rather than in the system RAM and separately copied out to the display.

I did a fresh bare minimum os setup yesterday on the zero 2 w, (previous was done on zero 1 w). The new Pi has a bit better performance as it's running on arm8 and 64 bit vs arm6 of the pi zero 1. I made a basic chromium startup and linked it to the leaflet maps example page which initially it loads a bit slower, but does not crash and when it's loaded it can actually keep up when panning around the map. The screen is currently running on my normal hdmi screen so performance will drop when shifting over to SPI, but I will try to get the page as fast responsive as possible and load as little as needed and then attempt to get the intended screen functional.

I also tried hosting a webpage on node red from the pi and accessing it though my phone's web browser which is actually much much faster and responsive! rjenkinsgb this seems to prove what you explained.

 

[Pommie]

Could this use a smart watch? Use the ESP32 to host a server and be an access point, connect to it with a smart watch and display whatever is on the server. The watch could also supply position information. Or, is this barking up the wrong tree?

Mike.

 

[ronsimpson]

With a dual core CPU, you could use Python to do most of your work on one core.
AND
Use the second core to send information to the display. (Graphics Processor)

I feel it is taking you 0.8Seconds to update the display and that could be pushed off and core 2.
It is common to use one CPU to do I/O and display functions.

 

[jasonlodder]

Could this use a smart watch? Use the ESP32 to host a server and be an access point, connect to it with a smart watch and display whatever is on the server. The watch could also supply position information. Or, is this barking up the wrong tree?

Mike.

Hi Pommie,


If you have a method or a source that can be used to implement a smart watch that can display a website, I would be very curious to learn about it. Running a local web server with node red and then accessing the webpages with my phone was my most reliable and responsive test so far.

Since a smart watch is portable, small, has a long battery life, and is sealed, it will be completely water resistant. Being able to access the display with one would solve many issues. My current biggest challenge is getting a cheap screen like the one mentioned in earlier posts to display. The bottle neck seems to be the driver board between the screen and the micro controller.

Yes, this can be accomplished with more expensive hardware, but one of the primary initial motivations for this project was to create a low-cost, open framework that was also modular, allowing anyone to connect their own sensors and hardware that is within their means. It would be great if these devices could be used in some of these projects so that people could learn how to use them in practical applications without having to make a significant initial investment because there are so many affordable smart watches and screens available.

I found some open source watches, but they don't look very promising and many have been discontinued.
I'm looking forward to your ideas and knowledge.

 

[jasonlodder]

With a dual core CPU, you could use Python to do most of your work on one core.
AND
Use the second core to send information to the display. (Graphics Processor)

I feel it is taking you 0.8Seconds to update the display and that could be pushed off and core 2.
It is common to use one CPU to do I/O and display functions.

Hi ronsimpson,

I've experimented in the past with my esp32's regarding using their cores in parallel for various processes, and yes, I believe it will significantly improve performance when implemented efficiently. Since I've been using ESPs for a while, they continue to be the main key driver behind the majority of my projects. However, I must admit that lately, the Raspberry Pi's that I've been experimenting with have shown some appreciable and significant advances.

In particular, the Pi Zero 2 W, which has a quad-core 64-bit processor and significantly more RAM than the ESP, I am aware that one is an SBC and the other a microcontroller, but the PICO is comparably priced to the ESPs and offers similar performance.

 

[Pommie]

I'm assuming that a smart watch has a web browser as part of the operating system.

Mike.

 

[Nigel Goodwin]

I'm assuming that a smart watch has a web browser as part of the operating system.

Mike.

As far as I'm aware most smart watches are more fitness based, and are really too small to have web browsers.