Our team is starting new project with initial consideration of react-native as a framework to build on top of (Majority of us have been within React ecosystem for a while now).
We are also discussing PWA only based approach since support is coming to Safari soon and Chrome already has good one with a lot of apis available and Desktop PWA's coming soon.
I wanted to ask community about possible complications related to PWA only approach, here are drawbacks we thought of:
1) No presence / discoverability in App / Play stores
2) No access to certain api's like NFC... (but by the looks of https://whatwebcando.today in chrome, we will have access to all we need)
3) Smooth UX will be hard to achieve (although very possible to do 60fps)
4) Users are not too familiar with PWA installation / usage process, might find it alienating
5) A lot of knowledge required to get good caching / networking and performance experience (Most of this we do know from web app development already however)
Some advantages
1) No cuts taken by app stores for in app digital content purchases
2) Truly one codebase for all platforms Mobile and Desktop
3) Lighter in terms of weight on user's device
4) Full control of release process
5) Easy and fast updates
6) Our team will develop higher quality code with tooling they are already familiar with as opposed to learning native bits of react native.
Assuming go live for the project after 7 - 9 months, is PWA a viable way to go forward with?
Like most of us here, we are getting started with PWA as well and had some similar questions. Trying to answer yours with our PWA startup experience.
Spoiler alert : Its is possible to create Production ready, high performing, write once run anywhere apps in PWA today. Learn from people who have done it- Ali express and Twitter. Here is one best article on comparisons of different options that we have today.
Question : 1) No presence / discoverability in App / Play stores
Answer: PWA Apps can be packed as an app(like .apk for Android) and published in app stores. This is possible for all platforms(iOS, Android, UWP). Here is a handy tool to pack (https://www.pwabuilder.com/).
What it does is packs your site(URL) into a hosted web app if supported(UWP) or use Cordova as polyfil by creating a webview and wrap your app(iOS, Android). Hoping Android will soon give option to avoid this polyfil. Until then, we can wrap in Cordova, and still take advantage of PWA features(like service worker-offline caching. iOS supports service worker only from 10.3).
Off-course, putting in app store comes with the cost of app store revenue sharing. Still with the PWA "Add to home option", you can slowly get new user base bypassing app store. One good back door for increased revenue if you are in paid app space.
Question : 2) No access to certain api's like NFC... (but by the looks of https://whatwebcando.today in chrome, we will have access to all we need)
Answer: If you are wrapping your app in cordova (as in above solution- PWA builder), you can use cordova plugins for things that are not supported..say NFC. This closes all hardware access limitations. we can keep replacing with PWA way as the support starts to come in feature. That's essentially what "Progressive" in PWA :)
Question :3) Smooth UX will be hard to achieve (although very possible to do 60fps)
Answer: Yes, you can't beat the FPS of a native app. But with PWA, it doesn't matter for the majority of the app out there(exclude apps like games, heavily animated apps), considering service workers- caching and other PWA features, apps can load fast and smooth enough to not have any frame drops that a human eye can detect. You wouldn't need more than 60fps to achieve that. Here is some good explanation and you can find so many such articles if you google for why 60fps.
If you are targeting any specific hardware in a enterprise environment, you can test the device's FPS here in the latest version of browser that supports PWA (chrome is a good one for now).
Question 4) Users are not too familiar with PWA installation / usage process, might find it alienating.
Answer: As mentioned in the first answer, you can continue to have your PWA site as an app (hosted app) in app stores and extend the PWA benefits to the in a web browser as well. PWA app benefits for the in browser user as well(like offline capability) and the option of asking the user to "Add to Home screen" is an another level of benefit you get with PWA (to increase the user engagement).
Question 5) A lot of knowledge required to get good caching / networking and performance experience (Most of this we do know from web app development already however)
Answer: PWA builder link above also helps you generate "Service worker" which solves your caching with not much complexity. Yes, there will be a lot of best practices out there and things will be keep coming as PWA evolves. You don't have to have everything in place to start with though. You can start with a basic service worker and manifest file to add to home screen/pack it as an app for app store and you can keep adding more PWA stuff on top of it as you progress.
All of the above work is going to give the benefits that you have mentioned and its worth the errfort
Related
Has anyone tried using Dash to make a mobile app?
I found it very useful to browse the Dash page on my phone, but I don’t want to enter Urls and log in every time.
And if it’s a mobile app, whether embedded or native, there are more features that can be implemented.
From my experience with dash, its not a current feature unfortunately.
To clarify plotly and dash have two different types of interaction. The vanilla plotly graphing library allows you to hover, zoom, pan,..etc. Dash is more about complete interaction between multiple graphs.
Dash is a web app framework, so it can't be a native app as the interaction capabilities come from the web app functionality. People have built hybrid apps using dash but the requests still go through your own dedicated dash app, which is hosted through the web browser. So in my perspective you're just doing redundant work that is done by plotly. That being said dash code can be made mobile friendly so (in my humble opinion) that would be a better route. But from colleagues that have explored this route, the click, hover, select events that are what makes dash so appealing, do not work very well without the precision of a mouse cursor.
Last point, if the vanilla plotly interaction is the only degree of interaction needed then those graphs can be embedded into a native app because they are offline.
It could be done, though perhaps there not an out-of-the-box solution for that purpose. But Plotly Dash is built with ReactJS, of which the "mobile version" is React Native.
ReactJS vs React Nativeenter link description here.
Having said that, consider not using a mobile application that you have to actually download (i.e. an APK) but instead a web app suitable for mobile devices. Compare it to having the Twitter app installed vs opening Twitter.com on your device. It "feels almost the same", and you don't have to download anything.
I recommend reading about Progressive Web Apps.
Example of PWA.
I am new to React Native. So here goes my scenario:
We need to create a new SDK that would be embedded into multiple technologies: React Web (JS), React Native APPs, iOS Apps (Swift and Obj-c), and Android Apps (Kotlin and Java). This SDK will offer:
APIs to get access tokens (issued by our corporate authenticator) so that the APP can talk to our API Gateway; something on the lines of getCurrentAccessToken();
Standard screens for login, Change Password, Forgot Password, OTP, etc; The UI should look and feel NATIVE to each target platform that it will be running on (Web, iOS, Android). Transitioning from a Native Screen to SDK's Screen should be smooth.
Be small (package size) and have OK/Hermes performance on both API Calls and Screen loading times (it doesn't need to be as fast as Native, as this SDK will be used once or twice every time the user starts the main APP);
I have checked boden.io (C++) but it would not work on WEB. It might still be an option (having 2 SDKs, one for WEB one for Mobile) so I didn't rule it out yet.
Is such a thing feasible in React Native? If feasible, is it a good idea?
PS: I know I would still need native binds/wrappers for each technology so that the SDK looks NATIVE to the caller, but that would be a minor issue.
Thanks
You can use go lang and gomobile to build the sdk for iOS, Android and Web.
We plan to create a hosted web app with AngularJS. As UI Framework we found Ionic and Onsen to work well with AngularJS. Both of this frameworks promote that they are made particularly for Hybrid Apps. But us I understand correctly, both frameworks are based on web technologies. So what are the drawbacks when using the suggested UI frameworks for non Hybrid Apps? Is it mainly the Browser support?
Thanks
Well, both Ionic and Onsen are made particularly for Hybrid Mobile Apps. You just won't be able to use it even for tablet apps without customization (If I am wrong, please correct me) just because they target the limited viewport and incorporate phone UX patterns.
Also, they are made with PhoneGap in mind (the apps will be hosted in the WebView component), and addresses some common WebView problems, e.g GPU acceleration for better performance.
If you need just some UI framework for a simple Web App you'd better have a look at Twitter Boostrap or Zurb Foundation. For a complex case you may even consider Sencha instead of Angular.
There is a part of Ionic that expects the Cordova/PhoneGap Device plugin to be installed. It helps with displaying on Android and iOS appropriately, as well as increasing the size of header bars for iOS 7. That wont be an issue for web though, since you'll have the browser's "chrome" taking up that space.
You may loose some of the buttery smoothness in things like page transitions because the template files need to travel over a (often cellular) connection to the internet, but your app will most certainly work if built with Ionic or Onses over the web.
Things changed considerably over last few months.
Both frameworks now support splitview so they can be used for tablet devices. Subjectively Onsen UI has a better support (it is much more configurable), but Ionic is also not bad. This can translate to smaller desktop browsers screens.
You should also consider that Onsen UI has a dedicated desktop browsers support (all web-kit browsers). Ionic framework will also work on desktop browsers, but it was not fully tested or optimized for such environment.
Biggest problem here is that both frameworks were never meant to be used on larger screens. They look oversized and bloated. If you ever worked with jQuery Mobile (on desktop browsers) you will understand this problem.
There is nothing stopping you from doing that - it might even be a smart approach for a mobile first design approach. The advantage is that you could rapidly iterate an idea an then invest in a native or platform specific app depending on user feedback/metrics.
The main drawback would be the user expectations for your UI and application logic which are different for a web page and a native app. For example the back button will be duplicated in the browser and in your header. You could use some platform specific CSS or configurations to hide it. Then there is your application state and user data - will you save it in local storage, session or database? This depends on your app and best judgement.
There will be some browser issues which may not be addressed in the core of Ionic and Onsen because they are not targeted to work with IE6/7 (see angular browser support), for example, but you can resolve those by having a graded browser support policy.
I am a webdeveloper. Have experiences in web development languages i.e PHP, HTML, CSS, jQuery. Ive been googling for sometime and still not clear for me if I should use phonegap.
I have a project which will be deployed in Web, iOS & Android.
The project is more on displaying data like belows :
User Profile (save profile / view proifle)
User Activities (displays all activities of users. get the new/latest activities everytime for display)
User Feeds (displays all feeds. get the new/latest feeds everytime for display)
User Subscription (displays all subscribers and subscribed by user)
Login/Logout/Register/Facebook Connect
Basically, it is more on displaying data.
So i assume the API calls will handle all the data saving and retrieval.
I will be making an API using PHP for retrieving and saving of data and i got no issue regarding this.
Also i should use a websocket/node.js kind of plugin for the realtime activities/feeds data.
All i want to know is if Phonegap fits for my needs.
We all know phonegap has many disadvantages and i want to ask the advice of experienced experts out there if Phonegap is good to go for this kind of project.
Any advice would be greatly appreciated.
Even though I don't have experience with phonegap, I'm kind of in the same boat as you. I recently started using titanium studio with the alloy mvc framework, definitely worth checking it out.
So far I have build myself a todo app working on both android and iOS, using a remote mysql database server to store my data on. They offer cloud services also, havent looked into that yet.
You can also buy modules in their store, often not that expensive and it will save you a lot of coding time.
Head over here for more information:
http://www.appcelerator.com/
Currently I am developing an app in corona sdk. It is still very early in the development stage so I can change the IDE or SDK if needed to achieve my goal.
I wish to create an app that can be played on multiple platforms(mainly ios and android) and I eventually want the users to be able to use the browser to continue playing at home with their progress saved. It is a simple app and could probably be recreated in html. They will have to login their accounts in order to play
How do i go about to achieve this? Should I complete my app in corona first, and then recreate the app in html and php and link the database to it separately or is there a specific development kit I could use that has this ability. Also, I am new to the development scene, how do I detect if the user is logged in a particular platform as I realize if they are logged in, in multiple places and give multiple entries it may cause problems.
If you are new to the development scene then you should continue developing with Corona.
Corona doesn't povide any web port but I know Unity does.
I think first you should complete your game for mobile platforms and if it will have success you can port it to web.
You can read this:
http://www.graphic-buffet.com/2012/06/indie-game-development-where-start/
You might want to try phonegap (http://phonegap.com/). I have never used it, I just know that it exists, so do some research to see if it would be a good fit. This might allow you to create the app once for both browsers and mobile.