People are using the canvas now to achieve fast speeds on mobile web. See Flipboard's post on this [1]. The big issue ppl brought up was that using canvas instead of DOM meant losing accessibility. Btw Flipboard released an interesting framework called React-Canvas[2] based on their efforts.
Your demo works, but I get an average of 10fps on my LG G3 and 20fps on my iPad, with the occasional freeze. The Flipboard demos are incredibly smooth with no lag or hanging at all.
iPad was released 5 years ago. I have iPad2 and iPad air 2, and both works fine.
I don't have LG. I have tested on Asus, Samsung S3, and Nexus 5. Try it on Chrome browser, and see how it works.
Some images (Washington post, latimes, etc) are bigger than 20 MB each. All browser freezes when you render those images. My demo specifically includes those to see how bad it performance on different devices.
One of the benefit of being a big company is you can control everything. Flipboard scales down those images to 300kb before sending it to browser. I use original images.
iPad Mini 3 if you really want me to be specific. I was trying it in the latest version of Chrome on my LG, that's where I get 10fps. Using the stock browser it freezes every other slide (and won't progress past slide 4).
> Some images (Washington post, latimes, etc) are bigger than 20 MB each
Why not use resized ones for your test? Sort of invalidates it if you can't tell if it's being janky because of the DOM or because of image size.
1. http://engineering.flipboard.com/2015/02/mobile-web/ 2. https://github.com/Flipboard/react-canvas