As I’ve been developing and experimenting with JavaScript over the last year-plus I’ve been more interested in showing my experience in simulation, graphics, and analysis than I have been with cross-browser- or backward-compatibility. If it ran on my phone (iPhone 5s and now 7) and the most recent versions of Firefox and Chrome then I was good. I found a few calls in my fast animation framework project that are going to need to be enhanced to support certain browsers and I’m going to revisit those, but I found myself being particularly annoyed by the fact that my stuff was no longer displaying properly on my 3rd-generation iPad. That iPad runs iOS version 9.3.5, which is in theory the final update for that device.
iOS is currently up to version 10.2 for more modern devices and it runs everything nicely. I therefore ran my discrete-event simulation project code through Babel (using its default, built-in conversion page) to see what features from JavaScript 6 I might be using. This is a more recent version of the language that might not be supported by the iPad’s slightly older OS. I knew I was using default function parameters from the latest spec but wasn’t sure if I might be using anything else. I may discuss Babel’s quirks on a different day but for now I’ll note that it didn’t appear turn up anything else. I went through and changed all the declarations that used default parameters to more traditional forms, sent it to my server, and tried it out on the iPad.
It didn’t work.
The next step was to plug the iPad into my Mac and walk through the code in the remote debugger. Sure enough, I’d missed changing one instance of a default parameter. When I fixed that and uploaded it again it ran just fine on the older device. Here it is below.
A direct link to the standalone page is here.
I noticed that my 3rd-gen iPad renders the lower canvas element, that shows the 3D animation built using the Three.js framework, with a white background. I don’t think I explicitly set the color for that background, it just seems to default to black on newer devices so I didn’t think more about it. I’ll see about setting it explicitly to black going forward.
I also notice that the simulation and its animations run a lot slower on the older device. The iPad 3 was the first to incorporate the hi-res Retina Display but still used an older CPU so the device was considered to be a bit strained. Most of the work of running the simulation involves generating the graphics. I’ll eventually make it so the animations can be turned off independently under user control and also so the simulation itself can run at full speed without having to wait for calls to the animation loop. Those should run pretty quickly even on older devices, but as I’ve discussed previously, that is ultimately a question of the scope and scale of a simulation.