Over the holidays, I ordered a Raspberry Pi 2 in to the office to play around with. If you've somehow not heard of it, it's a cheap credit-card sized computer (£30 in the UK). It's got a quad-core 900MHz CPU and a VideoCore IV GPU, which obviously isn't super powerful but given the price is actually pretty great. It's just the board - no case, no cables, and you'll need your own keyboard, mouse and display. But it's cheap, accessible, and hackable, and has proven popular especially in education. I love the idea of making computing low-level and accessible like this!
Naturally I wanted to check out what the browser support was like, and in particular if I could get WebGL running on it. This would allow Construct 2 games to run with reasonable performance. WebGL is also a great way to play with cross-platform 3D graphics and has a comparatively low barrier of entry given it's based around Javascript in a normal web page, so it seems like a good fit for the Raspberry Pi. However getting WebGL to run was not entirely straightforward, so I'm writing up what I did in this blog post to help out anyone else who wants to have a go.
Note these steps are very hacky and subject to change. I have also only done this on the Raspberry Pi 2 - other models will probably not work. You'll have to reformat the SD card, there's a lot of unofficial/unfinished code involved, and everything could change with future software releases. Hopefully this serves as a guide, but if you're reading this six months later, be wary a lot could have changed! Also if you use your Pi for anything serious, I would strongly recommend following these steps with a separate SD card, so if it works out horribly broken you can easily switch back to a working system.
Setting up the OS
I'm not 100% clear on the details, but it seems the official version of Raspbian currently uses a closed-source graphics driver that currently all browsers reject as not capable of supporting WebGL. However efforts are underway to write a new improved open-source graphics driver. This appears to be a work-in-progress and could ship with the official Raspbian in future, which would considerably simplify setting up WebGL. For now though, we must get a special build of Raspbian with this experimental new driver built in to it. This is unfinished software, so it is probably unstable compared to the official Raspbian. So this is probably only suitable for experimental purposes right now.
You can find the experimental build of Raspbian here: http://sukzessiv.net/~gohai/vc4-buildbot/build/
Just download the vc4-image.zip file (currently named 20151220-1053-vc4-image.zip). Follow the usual installation steps but using the .img file from this download instead of the official one.
As usual the SD card image may be smaller than the capacity of the SD card. To expand the file system to use all available space (ensuring you don't run out of space while installing the browsers or any other software), run sudo raspi-config from a terminal, choose "Expand Filesystem", and then reboot the system. There's more info here.
Setting up Chromium
The browser situation on the Raspberry Pi is a little bit tricky, especially if you're after modern technology like WebGL. Of the browsers I could find, I found the following:
- Epiphany (stock browser): based on an old version of WebKit that lacks WebGL support
- kweb (Minimal Kiosk Browser): also based on an old version of WebKit that lacks WebGL support
- IceWeasel (based on Firefox): can configure to force it to use WebGL, but it's terribly slow
- Chromium: can run WebGL with decent performance
So Chromium is the only browser which works well for WebGL. Google does not provide an official version of Chrome for Raspberry Pi, and so you have to rely on a third-party build of Chromium (the open-source engine behind Chrome). The latest version I could find was v47 which is reasonably up-to-date, installed from someone's Dropbox (hopefully it will stick around...) with these commands:
wget https://dl.dropboxusercontent.com/u/87113035/chromium-browser-l10n_47.0.2526.73-0ubuntu0.15.04.1.1190_all.deb
wget https://dl.dropboxusercontent.com/u/87113035/chromium-browser_47.0.2526.73-0ubuntu0.15.04.1.1190_armhf.deb
wget https://dl.dropboxusercontent.com/u/87113035/chromium-codecs-ffmpeg-extra_47.0.2526.73-0ubuntu0.15.04.1.1190_armhf.deb
sudo dpkg -i chromium-codecs-ffmpeg-extra_47.0.2526.73-0ubuntu0.15.04.1.1190_armhf.deb
sudo dpkg -i chromium-browser-l10n_47.0.2526.73-0ubuntu0.15.04.1.1190_all.deb chromium-browser_47.0.2526.73-0ubuntu0.15.04.1.1190_armhf.deb
If that's not working any more for some reason, or Chromium 47 is old by the time you're reading this, just Google for Chromium on Raspberry Pi - there should be something else out there.
When you've finished installing, Chromium should appear under "Internet" in the main menu. Start it up, and you'll see it looks and feels a lot like Chrome. WebGL support might work out of the box: visit get.webgl.org to check. Otherwise, type chrome://flags in the address bar, under "Override software rendering list" click "Enable", relaunch the browser when it prompts you to, and try again. You should see a spinning cube at the get.webgl.org page! You can also visit chrome://gpu to check the hardware acceleration status - it should say "WebGL: Hardware accelerated" in green.
IceWeasel
IceWeasel is a build of Firefox that works on the Raspberry Pi. Follow the instructions here to install it. To make sure it's using the GPU, visit about:config, click past the warning, and make sure webgl.force-enabled is set to true to ensure it will enable it. However performance seems poor: in some of my tests, where Chromium reaches 60 FPS IceWeasel can only manage 13 FPS or less. It's barely usable, so Chromium seems a better choice. I'd guess IceWeasel is ending up doing something like rendering WebGL but then copying the results on the CPU, effectively resorting to software-rendering the result of WebGL rendering. Hopefully a future version of IceWeasel will be better!
Results
Firstly, the experimental driver seems pretty unstable. Some demos have display glitches. The Raspbian build with this driver also seems prone to freezing and crashing, seemingly particularly when dragging around or resizing windows. Sometimes the screen goes corrupt or the entire system freezes, and you have to pull out the power to reboot it. Don't say I didn't warn you! If you want something stable, stick to official Raspbian for now.
However... it works! It can run 3D content with reasonable performance.
sbperftest can hit 60 FPS if the window is medium sized, and renders correctly. Fullscreen the hardware seems to struggle a bit and drops to about 30 FPS, but it's playable.
Even the HelloRacer demo runs, albeit slowly and with display glitches. It may look wrong, but the fact it runs at all is pretty impressive.
Clearly there is work to be done, but this proves it can work. Here's to hoping the new graphics driver is fixed and finished, and integrated to the official Raspbian. Hopefully other browsers available for the Raspberry Pi will gain WebGL support as well, making it easier to use. Looking to the future, I'm also hopeful future Pi hardware will upgrade the GPU, making it even more viable to use for WebGL content. I'd hope that could come with the right driver from the start!
Hopefully this guide helps others get WebGL set up on the Raspberry Pi 2, allowing for experimentation with advanced graphics in the browser. It should also provide an avenue for Construct 2 users to get their content running on a RPi 2 which could be fun to experiment with if you have one. A lot needs to happen to make this robust, with work on the driver, browsers and operating system necessary, and of course this could change a lot of the details in this blog. But it's an interesting start and maybe this could spur on some extra focus on this area.