I have been developing my app in chrome desktop/mobile and the performance has been very good all the time. It felt like 60fps really good! Then I wrapped my app into cordova, which is using the webView. The performance there is surprisingly bad. Animations feel like 10 fps, almost everything is lagging. Is there some way to improve this? Regards.
Hi,
without the code its very difficult to know who to improve it. Do you have a lot of animations?
Nothing special. For example, the left panel animation is moving with 5fps when I open it. Just a normal panel, as it is in the example app framework7.io on the landinpage. On mobile chrome it’s 60fps, but in Cordova around 5.
I use f7, both ios and android works fine.
Read here, maybe its usefull to understand low performance on android, which i didn’t notice on my app.
I have the same problem on my device. I have 2 androids: a Moto G 2nd edition (2011, I guess) with 1Gb RAM and a Asus ZenFone Selfie octa-core with 3Gb of RAM.
Cordova is a piece of **** on my Asus, but it runs fine on my old Moto G.
What I did before was to use Crosswalk (nowadays it’s not needed anymore and is a pain to make it work). This gave me a good performance boost, BUT, for Asus, I had to ignore the GPU blacklist (https://crosswalk-project.org/documentation/about/faq.html, see section Canvas and WebGL support). Doing so made my Asus usable (finally).
Android is a wonderful operating system, but the phones are a piece of **** (almost all of them, except for some rare models of Motorola). And is not about hardware (Samsung flagship are slow as hell, while a medium-end phone as Moto G works fine).
Can double this. To be honest i don’t really understand why is Android webView is so slow as hell when it is about animations and transitions. In my apps (for clients) i still use Crosswalk, it is deprecated a while ago but for some reason in many cases still performs better than new native Android webViews. I can also recommend to check the following:
- try to disable Touch Ripple effect, it can improve some things
- one of the slowest things in Android is
box-shadow, you can also try to set it tononefor panels
Thx for your tips. It is indeed really strange, as it seems to be a software problem. Otherwise the normal chrome mobile browser would not have always stable 60fps. Is is actually almost ridiculous, how big the performance difference to the webView actually is. To me it appears, that for some reason it seems there is no GPU rendering happening, but not on every phone. On some phones the webView will be almost like normal Chrome. But even on the newest phones, apparently, there is a high chance, that the webView is super slow. For example my grandmother has some cheap xiaomi for 120 bucks…WebView is incredible fast. Then you take a Samsung galaxy s7…webView is ultra slow…it is really weird.
1 Like
Compare resolution for these devices…
I don’t think the resolution can be a major factor, otherwise chrome mobile would not run quite stable on 60fps on every device, but it does.
On same android device, same app done with angular 1 + v1 is far faster than the app done with vue + v2, what you say about this ? I dont think user will ever use it when its so slow, I started to think whether its the underlying framework (angular/react or vue) regardless of the UI framework, or the v2 has serious performance issues when compared to v1.
I guess it’s due to webview engine is chrome or not (there’s a setting to change that). Perhaps some high-end devices use a custom OS build and do not use chrome webview as default, unlike a cheap XIaomi. I found this plugin but haven’t tried: https://github.com/Arva/cordova-plugin-crosswalk-webview (it’s supposed to use chrome webview if newer, otherwise it uses crosswalk, which could solve the problem).
On the other hand I also notice v2 is slower than v1. likely due to v2 added more layers such as router. Would v3 getting even much slower ? (and should you use React/Vue for a UI mobile app?)
1 Like
I have noticed that too, I dont know why but v2 is far slower than v1
And I dont think its all ripple effect, even scrolling -when there is no ripple- is hell slow, I cant believe anyone would want use an app when slow like this, there should be some solution,
I havent used but I wonder different webview solutions like crosswalk helps this performance issue
I also wonder, why is Cordova not simply using a real Chrome but the webView…It is so much faster…
Hi @pvtallulah,
Do you have any framework7 app hosted on playstore (android) let me download and check the speed and performance.
Most F7 apps run slow on android.
I published a app called lasso on play store, you can download it from there and check its performance.