Something really telling for me here is the fact that there are multiple people here (representing multiple companies) who have solved this problem and there doesn't seem to be an open source solution for it, let alone a dominant one.
It's clear that in general, we are all sick of writing a bunch of bespoke code and maintaining multiple platforms, and are seeking smart layers of abstractions over native widgets. It's a tale as old as time.
What's curious is why there isn't a standard/de-facto standard (like JSON based one maybe?) for UI layouts that has emerged, with a React Native adapter for it.
We are trying to solve this problem too with the same approach (the framework isn't the product, it's just because we don't want to spend too much time building custom Mobile components for our product).
It's not like people haven't tried. Just Microsoft has probably a half dozen of these. MAUI, WPF, etc.
Again, just curious that at least one format hasn't emerged for it.
> What's curious is why there isn't a standard/de-facto standard (like JSON based one maybe?) for UI layouts that has emerged
It hasn't emerged because nobody has done it. Nobody has done it because it's unbelievably hard and involves a lot of painful code of the sort that is not fun and therefore that people must be paid to write. Nobody has been paid to write it because nobody pays for dev tools and it's not in the best interest of any platform vendor to commoditize platforms.
Your correct this is hard, but I have to disagree that it involves painful code. Declarative UI in all 3 clients is a major enabler for doing this in a nice way.
I'm one of those people and in my opinion it would be hard to make a solution that fits all. The reason why it works for us is because we control the design system and we know the needs of our app and users. It works because it's somewhat bespoke to our use-cases.
It simply is not possible to represent the realm of all possible native UIs within a common json schema. We can do it because don't need the realm of all possible UIs. We need a 20 different elements recombined and reused across all our screens.
Which is also a strength because now we can leverage our limitations into delivering a consistent experience across our app.
That was basically AWT and then SWT in the Java world.
It can work for simple stuff. For anything more complex the underlying widgets are too different, you have to go with the lowest common denominator and the results just aren't good enough.
I was convinced Apple review guidelines state the core functionality of the app must be in the bundle that is reviewed and they would reject it if it's loaded mostly over http. Can see where they are coming from given they could review the app as a calculator app that then turns into a porn app post review.
Did the author just get lucky with the review process?
I've wondered about this and products like expo 'over the air' updates for React Apps etc. In theory does seem to infringe on these guidelines but are somewhat common in the iOS and Android eco-systems at the same time. I suspect an element of 'Don't ask don't tell' is being played out.
I also recall another guy -- who I think was openly advertising it as way to get around app store guidelines got taken down. JSONRoller or something my memory escapes me.
You can pack the JSON into the renderer if you want. The real meat of the app is the renderer itself, though. For example, you could put the menus and controls in an embedded JSON and then have the app fetch the data view from a server. It's not like your average Twitter or Facebook can show a whole lot without Internet access, so I don't think Apple will reject any apps that don't work without internet access. Add some certificate pinning for good measure and Apple will have to test on rooted iPhone to get access to the data being exchanged, and I don't think the testers really care enough about that stuff anyway. They'll much rather complaintthat you link to your website in a way that angers the Apple gods and other such low hanging fruit.
There are plenty of apps out there that are basically this but with custom logic. Lots of other apps are not much more than a webview with a custom "can't contact the servers" screen.
I suppose it's technically user-generated content, so it's fine? i.e. the app developer couldn't possibly know at review-time what it would be, and that run-time stuff is only distributed (in theory) to the person(s) that generated it; it isn't 'the core functionality of the app'.
I wouldn't be so sure. Ionic has a commercial product, AppFlow, which is their "update over http" solution. It allows for running arbitrary code without app approval, and they claim it is compliant. AirBNB and I'm sure plenty of other companies use "server driven UI" which is similar to this. Almost every app will also use feature flags in some way. Or could even just check if the account is "appreview@apple.com" and show different content, theres not a good way to prevent it.
This is really interesting to me.
At my job I maintain a very similar iOS render. Our app is built on the exact same principles, we have 3 native renderers (iOS, web app and Android) that consume the same JSON and generate native UI at runtime.
The schema even looks similar and as far as I know no one was aware of this project when this was built.
There are major disadvantages to this approach of course but there are also many many advantages.
We've been using the same UI data contract for the last 7 years, which has allowed us to survive several different platforms without adjusting a single line of business logic or UI code.
This looks really cool, nice! Neat that it’s already used in App Store apps too. And I like that it exposes native things like camera, will be interesting to see how that sort of thing works.
I noticed a couple of issues on the home page, in case the author is here:
- when I click documentation it says I’m viewing an old version, if I click OK to view the new version it’s a 404 (https://jasonelle.com/docs)
- Try Now links to an empty Heroku page, there’s a button to “build something amazing” but it just links to the Heroku home page
Oh yeah, if there was a way to send markup to the browser and have the browser render a UI for that. I wonder why nobody thought of that as of now ... oh. wait. ... ah we want "native" components. Yea. html only had "native components" for a long time, too ...
so - html as json without css and a richer component palette?
Readit News
It's clear that in general, we are all sick of writing a bunch of bespoke code and maintaining multiple platforms, and are seeking smart layers of abstractions over native widgets. It's a tale as old as time.
What's curious is why there isn't a standard/de-facto standard (like JSON based one maybe?) for UI layouts that has emerged, with a React Native adapter for it.
We are trying to solve this problem too with the same approach (the framework isn't the product, it's just because we don't want to spend too much time building custom Mobile components for our product).
It's not like people haven't tried. Just Microsoft has probably a half dozen of these. MAUI, WPF, etc.
Again, just curious that at least one format hasn't emerged for it.
It hasn't emerged because nobody has done it. Nobody has done it because it's unbelievably hard and involves a lot of painful code of the sort that is not fun and therefore that people must be paid to write. Nobody has been paid to write it because nobody pays for dev tools and it's not in the best interest of any platform vendor to commoditize platforms.
Like any reason why Airbnb can’t open source their solution? Seems battle tested.
The thing is that many people HAVE solved this.
Some context - https://github.com/MobileNativeFoundation/discussions/discus...
(Edit to add context)
It simply is not possible to represent the realm of all possible native UIs within a common json schema. We can do it because don't need the realm of all possible UIs. We need a 20 different elements recombined and reused across all our screens.
Which is also a strength because now we can leverage our limitations into delivering a consistent experience across our app.
It can work for simple stuff. For anything more complex the underlying widgets are too different, you have to go with the lowest common denominator and the results just aren't good enough.
Did the author just get lucky with the review process?
This is the guideline I'm referring to: https://developer.apple.com/news/?id=09062019b
I also recall another guy -- who I think was openly advertising it as way to get around app store guidelines got taken down. JSONRoller or something my memory escapes me.
There are plenty of apps out there that are basically this but with custom logic. Lots of other apps are not much more than a webview with a custom "can't contact the servers" screen.
https://jasonelle.com/
The schema even looks similar and as far as I know no one was aware of this project when this was built.
There are major disadvantages to this approach of course but there are also many many advantages.
We've been using the same UI data contract for the last 7 years, which has allowed us to survive several different platforms without adjusting a single line of business logic or UI code.
I noticed a couple of issues on the home page, in case the author is here:
- when I click documentation it says I’m viewing an old version, if I click OK to view the new version it’s a 404 (https://jasonelle.com/docs)
- Try Now links to an empty Heroku page, there’s a button to “build something amazing” but it just links to the Heroku home page
- the YouTube video near the top is private
https://adaptivecards.io/
Deleted Comment
so - html as json without css and a richer component palette?
1. Encoding behavior in custom components without resorting to Turing complete languages (JS), such that custom components (eg DatePicker)
2. Dependencies between components, like rules, become possible: If textfield A is empty, disable button B.
3. Access to native APIs that are not (yet) implemented in browsers.