Apple’s new iOS version 8 announcement brought many good news for the HTML5 developer community. Safari has improved much (it now supports WebGL for example, yay!) and the system webview now comes in two different flavors: UIWebView and WKWebView. The main difference is related to the JIT optimization for JavaScript. To put it in plain words: the execution speed for JavaScript code is orders of magnitude faster using a JIT compiler and thus, your web app may run much faster inside the new WKWebView than in our older friend the UIWebView. To know more about the WKWebView and to have a glimps of the performance improvements, please, check the following great article by Sencha or check our own tests below.
At Ludei, we immediately started playing around with the WKWebView as we were eager to provide it along with all the great runtime environments we have (Canvas+, WebView and WebView+ for Android). But there was a catch. At least in the current version of iOS, there is no way of deploying a native hybrid HTML5 app using the WKWebView that has access to local files, something that is quite common on Hybrid apps to be able to execute them off-line. But Ludei has always loved a good challenge and we decided to solve the problem and make the WKWebView available to every developer that would like to use it.
Today, we are happy to announce that we have added a way to create WKWebView based completely standalone hybrid applications for iOS 8 in our CocoonJS Cloud Compiler System version 2.1. As far as we know, no other technology allows to publicly create completely offline WKWebView based apps at the moment. We have decided to call the WKWebView based runtime environment: WebView+ on iOS 8. We will still provide Canvas+ and the regular UIWebView, but every CocoonJS developer that wants to take advantage of the WKWebView, is able to do it right now. Whenever the application is running on an iOS version lower than 8.0 where the WKWebView is not available, there will be a fallback to the UIWebView.
We have also added this shiny new WebView+ for iOS inside our CocoonJS Launcher that is still in review by Apple. Meanwhile, if you want to check the awesome performance that it provides, you can build a Custom CocoonJS Launcher using our cloud.
ADDITIONAL NOTE: We are working hard to add the WebView+ to the CocoonJS CLI too! Stay tuned!
WebView+ Vs WebView on iOS 8
We have performed some tests ourselves to check how much of a better option the WKWebView (CocoonJS WebView+ for iOS 8) is compared to the UIWebView (CocoonJS WebView). These are the results:
Canvas intensive operations
All the test were executed on a iPad Air iOS 8.0.2
First test
2000 sprites rotation + translation with sprite animation rotation and random colored vertices
- Webview+ : 30 FPS stable
- System Webview: 6 FPS stable
Second test
3000 sprites Rotation + translation. Using 3 framebuffers. Transparency and tint with custom shader and custom clip area
- Webview+: 20 FPS stable
- System Webview: 4 FPS with unstable frame timing
Third test
5000 sprites 32×32 using rotation + translation, tinted vertices and MipMap
- Webview+ 17 FPS stable
- System Webview: 3FPS with a frame timing between 379 and 400ms
Tests with well known benchmarks
All the test were executed on a iPhone 5 running iOS 8.0.2
Octane 2.0
Octane 2.0: is the javascript benchmark from the v8 team. Lets see the differences between webview+ and webview. The higher the mark, the better.
Octane test | Webview+ | Webview |
Richards | 2712 | 117 |
Deltablue | 2834 | 125 |
Crypto | 3491 | 203 |
Raytrace | 3474 | 365 |
EarleyBoyer | 5118 | 636 |
Regexp | 382 | 42,5 |
Splay | 2384 | 605 |
SplayLatency | 1641 | 2101 |
NavierStrokes | 3455 | 323 |
pdf.js | 3025 | 1006 |
Mandreel | 2407 | 118 |
MandreelLatency | 1784 | 702 |
GB emulator | 4593 | 943 |
CodeLoad | 5315 | 3912 |
Box2DWeb | 2806 | 689 |
zlib | 4675 | N/A |
Typescript | 4363 | N/A |
Octane Score | 2819 | N/A |
N/A means that the benchmark stops or freezes the the device.
Wirple BMark
This is test for webGL performance. The higher the score, the better.
Test Name | Webview+ | Webview |
Canvas test1 | 61 | 26 |
Canvas test 2 | 38 | 10 |
WebGL test 1 | 17 | 7 |
WebGL test 2 | 14 | 7 |
Total score | 130 | 50 |
Of course, some screenshots of the results Image may be NSFW.
Clik here to view.
The webview+’s results on Wirple BMark
Image may be NSFW.
Clik here to view.
The system webview after running Wirple BMark
Image may be NSFW.
Clik here to view.